Question

我有一个简单的反应原生组件，当我点击一个按钮时它触发一个动作，我希望它从同一个组件更新道具。

我正在做这样的事情：

component.js

class TypeButton extends Component {
    constructor(props) {
        super(props);
    }

    render() {
        return (
            <Button
                name = "Type"
                render = {this.customRender.bind(this)}
                onPress = {this.onPress.bind(this)}
                size={60}
            />
        )
    }

    onPress() {
        let type = this.props.type == FREE ? PAID : FREE;

        this.props.userInputAction({
            type : type
        });
    }

    customRender() {
        return (
            <Text> {this.props.type} </Text>
        )
    }
}

function mapStateToProps(state, ownProps) {
    if (state.userInputReducer)
        return state.userInputReducer.info;
    return {};
}

function mapDispatchToProps(dispatch) {
    return bindActionCreators(actions, dispatch);
}

export default connect(mapStateToProps, mapDispatchToProps)(TypeButton);

action.js

   export function userInput(info) {
        return {
            type : types.USER_INPUT,
            info
        }
    }

reducer.js

我有一个用于样板代码的create reducer函数：

export const userInputReducer = createReducer(
    {
        info : {
            type : constants.FREE
        }
    },
    {
        [types.USER_INPUT](state, action) {
            let info = action.info;
            if (state.info)
                info = _.assign(state.info, action.info);

            return {
                info
            }
        }
    }
)

问题是，mapStateToProps this.props.type中的值已更改，但customRender this.props.type中的值为旧值且未更新。你知道我做错了什么吗？

注意：

如果从mapStateToProps我返回一个包含类型的对象，例如：

function mapStateToProps(state, ownProps) {
    return state.userInputReducer;
}

并将所有this.props.type替换为this.props.info.type一切正常吗？我真的不明白问题是什么？

React native redux不能正确更新道具

0 个答案: