javascript - 如何使用 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;