Meteor JS ReactMeteorData - CreateContainer - 超级表达式必须为空或函数

Question

从 1.4 升级到 Meteor 1.5 后，react-meteor-data 的 createContainer 函数给出以下错误：

Uncaught TypeError: Super expression must either be null or a function, not undefined
    at exports.default (modules.js?hash=fb99b6a…:1144)
    at ReactMeteorData.jsx:6
    at ReactMeteorData.jsx:6
    at createContainer (createContainer.jsx:16)
    at AppContainer.jsx (AppContainer.jsx:8)

AppContainer.jsx：

import { Meteor } from 'meteor/meteor';

import { Session } from 'meteor/session';
import { createContainer } from 'meteor/react-meteor-data';

import App from '../layouts/App.jsx';

export default AppContainer = createContainer(props => {
  return {
    currentUser: Meteor.user(),
  };
}, App);

下面的应用程序文件，在构造函数中我正在执行 super(props) 但是仍然抛出错误

App.jsx：

class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      menuOpen: false,
      showConnectionIssue: false,
      headerTitle: null,
    };
    this.setHeaderTitle = this.setHeaderTitle.bind(this);
    this.logout = this.logout.bind(this);
  }

  logout() {
    Meteor.logout();
    this.context.router.replace(`/home`);
  }

  render() {
    ... omitted render function
  }
}

App.propTypes = {
  user: React.PropTypes.object,      // current meteor user
  connected: React.PropTypes.bool,   // server connection status
  loading: React.PropTypes.bool,     // subscription status
  menuOpen: React.PropTypes.bool,    // is side menu open?
  children: React.PropTypes.element, // matched child route component
  location: React.PropTypes.object,  // current router location
  params: React.PropTypes.object,    // parameters of the current route
};

App.contextTypes = {
  router: React.PropTypes.object,
};

export default App;

Answer 1

就个人而言，对于容器数据，我确实喜欢这样（来自 masterchef Base，已更新并正常工作）：

/* AppContainer.js */

// import react and proptypes ...
import { Meteor } from 'meteor/meteor';
import container from '../../../modules/container';

// Some code for app layout and proptypes...

export default container((props, onData) => {
  const user= Meteor.user(); // adapted for your case
  onData(null, {
    currentUser:user,
    // and others data ...
  });
}, App);




/* container.js */

import { compose } from 'react-komposer';
import getTrackerLoader from './get-tracker-loader';

export default function container(composer, Component, options = {}) {
  return compose(getTrackerLoader(composer), options)(Component);
}




/* get-tracker-loader.js */

import { Tracker } from 'meteor/tracker';

export default function getTrackerLoader(reactiveMapper) {
  return (props, onData, env) => {
    let trackerCleanup = null;

    const handler = Tracker.nonreactive(() => Tracker.autorun(() => {
      trackerCleanup = reactiveMapper(props, onData, env);
    }));

    return () => {
      if (typeof trackerCleanup === 'function') trackerCleanup();
      return handler.stop();
    };
  };
}

希望对你有用。

Answer 2

尝试以下 sn-p:

export default AppContainer = createContainer((props) => {
  // do subscriptions if you have any
  return {
    currentUser: Meteor.user(),
  };
}, App);

Answer 3

您可能在应用组件中缺少super()。