react-native – 订阅Redux中存储中的单个属性更改

store.subscribe(() => my handler goes here)

当直接使用订阅时,无法订阅部分商店,但是Redux的创建者自己说 – don’t use subscribe directly!为了使Redux应用程序的数据流真正工作,您将需要一个包装整个应用程序的组件.该组件将订阅您的商店.其余的组件将是这个包装器组件的子代,并且只能获得它们所需状态的部分.

如果您正在使用Redux with React,那么有一个好消息 – 官方react-redux包为您照顾！它提供了包装器组件,称为< Provider /&gt ;.然后,您将至少有一个“智能组件”可以侦听来自商店的提供者传递的状态更改.你可以指定哪个州的哪个部分应该听,而这些状态将作为道具传递给该组件(然后当然可以将它们传递给自己的孩子).您可以通过在“智能”组件上使用connect()功能并使用mapStateToProps功能作为第一个参数来指定.总结：

使用提供程序组件包装订阅存储更改的根组件

ReactDOM.render(
  <Provider store={store}>
    <App />
  </Provider>,document.getElementById('root')
)

现在,任何< App />用connect()包装将是一个“智能”组件.您可以传递mapStateToProps来选择状态的某些部分,并将其作为道具.

const mapStateToProps = (state) => {
    return {
        somethingFromStore: state.somethingFromStore
    }
}

class ChildOfApp extends Component {
    render() {
        return <div>{this.props.somethingFromStore}</div>
    }
}

//wrap App in connect and pass in mapStateToProps
export default connect(mapStateToProps)(ChildOfApp)

显然< App />可以有很多孩子,您可以选择并选择mapStateToProps为其每个孩子应该收听的状态的哪些部分.我建议您在usage with React阅读文档,以更好地了解此流程.