Question

我有点多余，所以我使用这个钩子更方便

我有一些文件

这是我的减速器

import UserName from '../NAVBAR/log_in'
const initialState = {
    username: UserName
};

export function userReducer(state = initialState, action) {
    console.log('USER-action', action);
    switch (action.type) {
        case 'USER_NAME':
            return {
                ...state,
                username: action.payload
            };
        default:
            return state;
    }
}

这是我的登录文件

我把>>>>>>>弄清楚了

function Login(props) {
    var classes = useStyles();
    var [username, setUsername] = useState('')
    var [password, setPassword] = useState('')

    var dispatch = useDispatch();

    >>>>>>const UserName = useSelector((state) => state.username);

       >>>>>>>>>> Sign in:-{props.UserName}</Typography>
                        <TextField
                            variant="outlined"
                            margin="normal"
                            fullWidth
                            value={username}
                            onChange={(e) => setUsername(e.target.value)}
                 >>>>>>>>>>>onClick={() => dispatch({ type: 'USER_NAME', payload: username })}

                        />

图像 View post on imgur.com

我在做错什么吗？

如果您需要图片或其他东西，我会上传

Answer 1

使用此设置，本地状态和redux状态似乎是多余的。

要么修改您的onChange来分派您的操作，要么添加一个提交按钮来分派您的操作以更新redux。但是，如果这和您的表单一样复杂，我将跳过本地状态，只让您的表单读取和更新redux。

我想从react发送状态到redux钩子我该怎么做

1 个答案: