Question

我有一个React组件，目前只是从Redux中检索一个状态。这是总体布局：

const mapStateToProps = state => {
     return { stuff: state.stuff };
};

class MyComponent extends React.Component {
    // use 'stuff' from redux to build the Views
}

export default connect(mapStateToProps)(MyComponent);

但是现在，如果我想添加一个更改另一个名为other的Redux状态的按钮怎么办？

要保存新的Redux状态，我知道我们必须为该操作创建一个调度。即，

const mapDispatchToProps = dispatch => {
....
};

然后最后连接它们：

connect(null, mapDispatchToProps)(MyComponent);

但我的困惑是，如果我已经与mapStateToProps连接，我怎样才能将它映射到mapDispatchToProps，以便我可以在同一个组件中更新Redux状态？

Answer 1

你可以同时使用; - ）

例如：

Action.js

export const textChanged = (newText) => {
    return { type: "TEXT_CHANGED", newText }
};

HomeScene.js：

import { textChanged } from "../actions;

...

render () {
    const { myText } = this.props;

    <TextInput 
     value={myText}
     onChangeText={(newText) => this.props.textChanged(newText)}
    />
}

function mapStateToProps(state) {
    return {
        myText: state.appContent.myText
    };
}

export default connect(mapStateToProps, { textChanged })(HomeScene);

Reducer.js

case "TEXT_CHANGED":
        return {
            ...state,
            myText: action.newText
        };

希望它有所帮助！

Answer 2

嗯，看起来我太早问了。我做了一些阅读，connect()中的参数实际上都接受了。

所以这样：

connect(mapStateToProps, mapDispatchToProps)(MyComponent)

检索Redux状态，还在同一个React Native组件中更改另一个Redux状态？

2 个答案: