【问题标题】:Redux-orm not calling mapStateToProps after adding data添加数据后 Redux-orm 不调用 mapStateToProps
【发布时间】:2017-03-29 13:51:15
【问题描述】:

我正在使用 redux-orm,在添加实体后,我的选择器没有使用 mapStateToProps 中的新对象进行更新,因此导致 render() 不再被调用。我已经阅读了教程,但看不到我做错了什么:

另一个组件正在调用 BookReducer,所以我知道 100% 正在调用减速器。

这是我的减速器:

export default function BookReducer(state = initialState, action) {

    const session = orm.session(state);

    switch (action.type) {

        case 'newBook':

            session.Book.create({ id: 0, type: 'novel' });

            //I can see verify that the object has been added  to the ORM
            console.log(session.Book.all().toRefArray())
     }

     return session.state; 
}

这是我的选择器:

import orm from './orm';

const BookSelector = createSelector(orm, state => state.orm, session => {
    return session.Book.all().toRefArray()
});

这是我的组件:

class Main extends React.Component {

  constructor(props) {
      super(props);
  }

  render() {

    console.log("debug")
    console.log(this.props.books)

    return (
       <div>
           {this.props.books}
       </div>
    )


    function mapStateToProps(state) {

       return {
          isOpen: true,
          books: BookSelector(state)
       };
    }
}

【问题讨论】:

  • 你安装了 Redux chrome 插件吗?你能用它确认你的书店里你的书店里有正确的新书吗?如果您的商店没有正确调用,问题可能出在您的减速器中

标签: reactjs redux react-redux redux-orm


【解决方案1】:

您似乎没有将 Main 组件与 mapStateToProps 连接起来。像export default connect(mapStateToProps)(Main); 一样使用connect 并在Main 组件之外定义它

import connect from 'react-redux';

class Main extends React.Component {

  constructor(props) {
      super(props);
  }

  render() {

    console.log("debug")
    console.log(this.props.books)

    return (
       <div>
           {this.props.books}
       </div>
    )



}

  function mapStateToProps(state) {

       return {
          isOpen: true,
          books: BookSelector(state)
       };
    }
export default connect(mapStateToProps)(Main);

您还需要导出和导入BookSelector

import orm from './orm';

const BookSelector = createSelector(orm, state => state.orm, session => {
    return session.Book.all().toRefArray()
});
export default BookSelector;

【讨论】:

  • 嗨,Shubham,该组件已与 connect(mapStateToProps)(Main) 连接,抱歉忘记粘贴了。还有其他想法吗?
  • 嗨 Lance,按照建议,将 mapStateToProps 函数保留在组件之外,并且您是否将组件包装在提供程序标记中
  • 嗨 Shubham,mapStateToProps 在组件之外,但没有帮助。 MapStateToProps 正在处理其他更改状态的测试组件(非 redux-orm)的状态更改,它只是无法看到来自 redux-orm 的更改。是的,根 index.js 将所有内容都包装在存储提供程序中。
  • 你还没有导出你的选书器组件
  • 嗨,Shubham,很抱歉它被导出了。我想如果它根本无法调用它,我会得到一个错误。只是每当调用选择器时,它总是返回 0 值。如果我将调试语句放在选择器中以查看状态或打印,我也会得到 0 个值。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2019-07-13
  • 1970-01-01
  • 2019-01-31
  • 2019-11-10
  • 1970-01-01
  • 2018-11-05
  • 2018-08-07
相关资源
最近更新 更多