Question

我想在我的本机应用程序中使用redux 并且我正确地使我的减速机（我认为）之后创建商店然后使用调度或存储但我得到错误实际上我不能使用调度

我的app.js：

   const store = createStore(rootReducer, applyMiddleware(logger));
export default class taav extends Component {
render() {
    return (
        <Provider store={store}>
            <Chatroom />
        </Provider>
    );
}
}

和我的聊天室：

  import React, {Component} from 'react';
 import {Text, Button, TabBarIOS, View} from 'react-native'
 import MessageList from './messageList'
 import {connect} from 'react-redux'


const mapStateToProps = (state) => {
return {
    testtest: state.chatroom.teststore.test
}
 }

   export const Testredux = connect(mapStateToProps)(MessageList)


      export default class Chatroom extends Component {
   state = {
    test2: "dfsd"
}

componentDidMount() {
    console.log('this')
}

btn() {


    dispatch({type: 'test1'})////////////this is wrong???
}

render() {

    return (
        <View>
            <Testredux test={'sdfdsf'}/>
            <Button title={'sdfsdf'} onPress={this.btn.bind(this)}/>
        </View>  )


}


 }

你知道为什么我不能使用派遣吗？

Answer 1

您尚未导入＆＃39;发送＆＃39;在任何地方运作，以便您无法使用它。您必须导入商店，然后调用store.dispatch（）。

然而，最好的（也是推荐的）方法是在导出聊天室 mapDispatchToProps 与react-redux中的连接功能>组件：

function mapDispatchToProps(dispatch) {
    return({
        sendTestAction: () => { dispatch({type: 'test1'}) }
    })
}

...然后在导出组件时将其与 connect 一起使用：

connect(mapStateToProps, mapDispatchToProps)(Chatroom)

在聊天室组件中，您可以执行以下操作：

render() {
    return (
        <View>
            <Testredux test={ 'sdfdsf' }/>
            <Button title={ 'sdfsdf' } onPress={ this.props.sendTestAction }/>
        </View>
    )
}

我希望这会有所帮助。

Answer 2

您正在连接错误的班级

export const Testredux = connect(mapStateToProps)(MessageList)

应该是

export const Testredux = connect(mapStateToProps)(Chatroom)

Answer 3

dispatch是传递给connect调用中包含的组件的道具。由于您正在包裹MessageList而不是Chatroom，Chatroom的实例无法访问Redux传递的任何道具。

此外，dispatch应作为道具访问，因此它应为this.props.dispatch，而不仅仅是dispatch：

btn() {
    this.props.dispatch({type: 'test1'})
}

无法访问redux应用程序中的商店

3 个答案: