错误:操作必须是纯对象。将自定义中间件用于非API调用更新的异步操作

我正试图管理一个没有任何 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}))
}

你知道有什么问题吗?