时间戳

首页 > 解决方案 > 如何将输入值设置为 redux reducer 文件中的状态？

javascript - 如何将输入值设置为 redux reducer 文件中的状态？

问题描述

这是我的输入

<input
                type="text"
                onChange={(e) => {
                    props.setInputVal(e.target.value);
                }}
            />

这是动作文件


export const setInputVal = (val) => {
    return {
        type: SET_INPUT,
        payload: val
    };
};

这是我想在 redux reducer 中设置输入值的状态

const initialState = {
    inputVal: ''
};

export const reducer = (state = initialState, action) => {
    switch (action.type) {
        case SET_INPUT:
            return {
                inputVal: [ action.payload ]
            };
        default:
            return state;
    }
};

但是我收到了一个错误，所以当用户在 redux reducer 中输入 inputVal 状态时，如何正确设置输入值？

标签： javascriptreactjsinputredux

解决方案

我猜你得到的错误与在动作分派inputVal时变成数组而不是字符串的事实有关。SET_INPUT修复你的减速器如下：

export const reducer = (state = initialState, action) => {
    switch (action.type) {
        case SET_INPUT:
            return {
                ...state,
                inputVal: action.payload
            };
        default:
            return state;
    }
};

您还必须使用函数连接inputVal到输入值：connect()

<input type="text" value={props.inputVal} {...} />

推荐阅读