Question

我正尝试在没有任何a sync动作的情况下管理单个状态，但是会遇到此错误。这是我的store.js：

import { createStore } from "redux";
import reducer from "./../reducers";

const initialState = { todolist: [] };
export const store = createStore(reducer, initialState);

这是我的action.js：

export const setTodolist = listitem => {
    ({ type: "SET_TODOLIST", todolist: listitem })
};

这是我的reducer.js：

export default (state, action) => {
    console.log(state , "reducer")
    switch (action.type) {
        case "SET_TODOLIST":
            return {
                ...state,
                todolist: [...state,  action.todolist]
            };
      default:
            return state;
    }
};

最后这是我的组件：

import { store } from "./../redux/store";
import { setTodolist } from '../redux/actions';

export default class Mylist extends React.Component {
  render() {
      return (
          <input    placeholder="username" 
                    name="inputval" />
          <button className="mt-4" color="success" onClick={dispatchBtnAction} >Add Todo</button>   
      ) 
  }
}
function dispatchBtnAction(e) {
    const val = document.getElementsByName("inputval").value;
    store.dispatch(setTodolist({val}))
}

你知道是什么问题吗？

Answer 1

您的操作语法不正确。使用您当前的语法，指定的对象只是一个代码块，不会返回。您应该这样写

export const setTodolist = listitem => (
    { type: "SET_TODOLIST", todolist: listitem })
);

或

export const setTodolist = listitem => {
    return { type: "SET_TODOLIST", todolist: listitem }
};

错误：动作必须是普通对象。使用自定义中间件对异步操作进行非api调用更新

1 个答案: