如何使用MUI Texfield&Redux更改状态

Question

我有一个输入字段，我试图在移动到单独的页面之前传递一些信息。我的问题是Redux状态没有改变，但控制台显示值正在正确传递。我假设我的切片有问题，但我相信我正确地传递了有效载荷。我的Redux切片看起来像:

import { createSlice } from "@reduxjs/toolkit";
export const walletSlice = createSlice({
name: "wallet",
initialState: {
wallet: "xxx-xxxx-xxx-xxxx",
},
reducers: {
setWalletAddress: (state, action) => {
state.value = action.payload;
},
},
});
export const { setWalletAddress } = walletSlice.actions;
export default walletSlice.reducer;

而我的from组件看起来像:

import { setWalletAddress } from "../../redux/wallet";
import { useDispatch } from "react-redux";
export default function AddressForm() {
return (
const dispatch = useDispatch();
const handleChangeWallet = (event) => {
dispatch(setWalletAddress (event.target.value));
console.log(event.target.value);
};
<React.Fragment>
<TextField
onChange={handleChangeWallet}
label="Wallet address"
/>
</React.Fragment>
);
}

我的商店看起来很标准:

export default configureStore({
reducer: {
wallet: walletReducer,
},
});

Answer 1

我假设您需要在reducer函数中使用正确的状态字段名。我猜下面的代码行有问题，

state.value = action.payload;

相反，您需要写正确的字段名称wallet而不是value

state.wallet = action.payload;

Answer 2

您输入了value而不是wallet

setWalletAddress: (state, action) => {
state.wallet = action.payload;
},