ReferenceError：在初始化应用程序之前无法访问'todos'，反应js

【问题标题】：ReferenceError: Cannot access 'todos' before initialization App, react jsReferenceError：在初始化应用程序之前无法访问'todos'，反应js
【发布时间】：2021-12-26 18:50:14
【问题描述】：

在 useEffect 上收到错误“ReferenceError: Cannot access 'todos' before initialization”

function App() {
    //use effect
    useEffect(() =>{
        filterHandler();
    },[todos, status]); 


    //input text
    const [inputText,setInputText]=useState('');

    //todo list
    const[todos , setTodos] = useState([]);
    return (
        <div className="App">
            <header>
            <h1>Todo List</h1>
            </header>
            <Form 
                todos={todos} 
            />
        </div>
    )
}

【问题讨论】：

标签： reactjs use-effect

【解决方案1】：

您在组件顶部附近使用 todos，但直到组件的较低位置才创建变量。您将需要交换订单，以便您先创建它，然后再使用它。

function App() {
  //todo list
  const [todos, setTodos] = useState([]);

  //use effect
  useEffect(() => {
    filterHandler();
  }, [todos, status]);

  //input text
  const [inputText, setInputText] = useState("");

  return (
    <div className="App">
      <header>
        <h1>Todo List</h1>
      </header>
      <Form todos={todos} />
    </div>
  );
}

【讨论】：