Reactnative 在 Redux 中订阅 store 中的单个属性更改

当直接使用subscribe时，无法订阅部分应用store ，但正如Redux的创建者自己所说的那样——don't use subscribe directly!为了让Redux应用程序的数据流真正起作用，你需要一个组件来包装整个应用程序.此组件将订阅您的应用store .其余的组件将是这个包装器组件的子组件，并且只获得它们需要的部分状态.

如果你在React中使用Redux，那么有一个好消息——官方的react-redux包会帮你解决这个问题！它提供了名为<Provider />的包装器组件.然后，您将拥有至少一个"智能组件"，用于侦听Provider从store 传递的状态更改.您可以指定它应该监听的状态部分，这些状态部分将作为props 传递给该组件(当然，它可以将它们传递给自己的子组件).您可以通过在"智能"组件上使用connect()函数并将mapStateToProps函数用作第一个参数来指定.总结一下:

用Provider个订阅以存储更改的组件包装根组件

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

现在，任何<App />岁的子元素如果用connect()包裹，都将成为"智能"组件.你可以通过mapStateToProps来 Select 该州的某些部分，并将其作为props .

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 />可以有很多子元素，你可以 Select mapStateToProps应该 for each 子元素听哪个州的音乐.我建议阅读usage with React页上的文档，以便更好地理解这个流程.