首页 > 解决方案 > React TypeError:“x”不是函数

问题描述

我在子组件中从父级调用了一个函数 setTodos,但这会返回以下错误:

setTodos 不是函数

你能解释一下为什么会这样吗,非常感谢。这是我的代码:

import React, { useState } from 'react';
import './App.css';
import Form from './components/Form';
import TodoList from './components/TodoList';

function App() {
   const [inputText, setInputText] = useState("");
   const [todos, setTodos] = useState([]);
   return (
      <div className="App">
         <header>
            <h1>Phuc's Todo list</h1>
         </header>
         <Form inputText={inputText} todos={todos} setTodos={setTodos}/>
         <TodoList/>
      </div>
   );
}

export default App;
import React from 'react';

const Form = ({inputText, setInputText, todos, setToDos}) => {
   const inputTextHandler = (e) => {
      setInputText(e.target.value);
   }
   const submitTodoHandler = (e) => {
      e.preventDefault();
      setToDos([
         ...todos,
         {text: inputText, completed: false, id: Math.randowm()*1000}
      ])
   }
   return (
      ...
   )
}

标签: javascriptreactjs

解决方案


setTodos调用in时,您的代码中有错字child component

它应该setTodos在 child 而不是setToDos. 你有大写的D,应该是小写的d

由于 Javascript 是区分大小写的语言。所以你必须使用确切的术语。

setTodos([//here your code]);

推荐阅读