Javascript 为什么我的redux状态为null，但在控制台中一切正常

我正在尝试制作todo应用程序，但是， 每次输入内容时，我的redux开发工具都会显示一个“”（空字符串）

我的头发看起来像这样

const TodoReducer = (state = initialState, action) => {
    switch(action.type){
        case 'ADD_TODO':
           return {
               ...state,
               todoList: [...state.todoList, action.item]
           }
    }
}

export default TodoReducer;

function App() {
  const [input, setInput] = useState('');

  const todoList = useSelector(state => state.todoList)

  const dispatch = useDispatch();

  const addHandler = () => {
    console.log(`adding ${input}`)
    dispatch(addTodo({
      item: input
  }))
    setInput('');
  }
  

  return (
    <div>
        <p>TODO</p>
        <p>{todoList}</p>
        <input type="text"
        value={input}
        onChange={e=> setInput(e.target.value)}
        />

        <button type="button" onClick={addHandler}>Add</button>
    </div>
  );
}

我的行动

export const addTodo = () => {
    return {
        type: 'ADD_TODO',
        item: ''
    }
}

和App.js

const TodoReducer = (state = initialState, action) => {
    switch(action.type){
        case 'ADD_TODO':
           return {
               ...state,
               todoList: [...state.todoList, action.item]
           }
    }
}

export default TodoReducer;

function App() {
  const [input, setInput] = useState('');

  const todoList = useSelector(state => state.todoList)

  const dispatch = useDispatch();

  const addHandler = () => {
    console.log(`adding ${input}`)
    dispatch(addTodo({
      item: input
  }))
    setInput('');
  }
  

  return (
    <div>
        <p>TODO</p>
        <p>{todoList}</p>
        <input type="text"
        value={input}
        onChange={e=> setInput(e.target.value)}
        />

        <button type="button" onClick={addHandler}>Add</button>
    </div>
  );
}

函数应用程序（）{
const[input，setInput]=useState（“”）；
const todoList=useSelector（state=>state.todoList）
const dispatch=usedpatch（）；
常量addHandler=（）=>{
log（`adding${input}`）
调度（addTodo）({
项目：投入
}))
设置输入（“”）；
}
返回(
待办事项

{托多利斯特}

setInput（e.target.value）}
/>
添加
);
}

---

先谢谢你。感谢您提供的任何帮助

您忘记将项目作为输入传递给操作并返回

更改：

export const addTodo = () => {
    return {
        type: 'ADD_TODO',
        item: ''
    }
}

致：

及

改变

        <p>{todoList}</p>

{todoList}

到

{Array.isArray（todoList）&&
todoList.map（（项，项索引）=>(
{item}
))}

您忘记将项目作为输入传递给操作并返回

更改：

export const addTodo = () => {
    return {
        type: 'ADD_TODO',
        item: ''
    }
}

致：

及

改变

        <p>{todoList}</p>

{todoList}

到

{Array.isArray（todoList）&&
todoList.map（（项，项索引）=>(
{item}
))}

谢谢您的step by sir，但结果是错误的，它说：错误：对象作为React子对象无效（找到：具有键{item}的对象）。您不能只给出要呈现的字符串数组。问题是

{todoList}

。按照更新后的文档中的说明进行更新answer@HutapeaDollyton，检查更新的答案我现在看到了，非常感谢SirStep by sir，但是结果是错误的，它说：错误：对象作为React子对象无效（找到：具有键{item}的对象）。您不能只给出要呈现的字符串数组。问题是

{todoList}

。按照更新后的文档中的说明进行更新answer@HutapeaDollyton，查看更新的答案啊，我现在看到了，非常感谢，先生