【问题标题】:State null in component组件中的状态为空
【发布时间】:2015-02-09 05:56:43
【问题描述】:

我在使用 react 和 martyjs 创建组件时遇到问题。我确定这是一个错字或什么的,但我似乎无法找到它。虽然我在组件中有一个状态混合,但状态没有被填充,看起来 getState 甚至没有在混合中被调用。

Mixin.es6

var StateMixin = Marty.createStateMixin({
  listenTo: VideoStore,
  getState: function() {
    return {
      items: VideoStore.list(),
      currentItem: VideoStore.select(),
    }
  }
});

State.es6

var VideoStore = Marty.createStore({
  displayName: "Store",
  handlers: {
    list: Events.List,
    render: Events.Render
  },
  getInitialState: function(){
    return {  };
  },
  list: function(){
    return this.fetch({
      id: 'list',
      locally: function(){
        if(this.hasAlreadyFetched('list') )
          return this.state.items;
      },
      remotely: function(){
        return  DissolveStateSource.list();
      }
    });
  },
  select: function(){},
  render: function(){}
});

组件.es6

$( ()=>
React.render(
  <VideosTable/>,
  $("#container")[0]
));

var VideosTable = React.createClass(
{
  mixins: StateMixin,
  render: function() {
    var body = this.state.list.when({  //state is null here
      pending: function(){
        return <span className="ball"></span>;
      },
      failed: function(error){
        return <div className="error">error.message</div>;
      },
      done: function(videos){
        return <div>Videos</div>;
      }
    });

    return <h2>hello</h2>;
  }
});

知道我做错了什么吗?

编辑:我在这里添加了一个 js bin 的东西

http://jsbin.com/lekegicumo/2/edit?html,js,console,output

【问题讨论】:

    标签: javascript reactjs martyjs


    【解决方案1】:

    在我看来,Mixin.es6 中的错字。

    getState 更改为getInitialState

    另外,在Component.es6:

    mixins: StateMixin 更改为mixins: [StateMixin]

    【讨论】:

    • 我试过了,但 getInitialState 也没有被调用。似乎没有调用 mixin 中的任何内容。
    • @stimms 发现了另一个罪魁祸首。检查我编辑的答案。
    • 也试过了。我实际上查看了 marty 代码,它允许在那里使用数组或单个 mixin。我在这里添加了一个实时版本jsbin.com/lekegicumo/2/edit?html,js,console,output,以便其他人可以看到我在做什么
    【解决方案2】:

    问题最终是 JavaScript 文件的包含顺序不正确。交换一些解决了这个问题。

    【讨论】:

      【解决方案3】:

      你在使用 react v0.1.13.0

      这是使用 'construct' 初始化状态的新方法

      constructor(props) {
          super(props);
          this.state = {count: props.initialCount};
        }
      

      https://facebook.github.io/react/blog/2015/01/27/react-v0.13.0-beta-1.html

      【讨论】:

        猜你喜欢
        • 2021-05-12
        • 1970-01-01
        • 2019-04-07
        • 2016-04-19
        • 2021-01-14
        • 2017-10-05
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多