小编iLo*_*les的帖子

我的react函数组件会不断地重新渲染自身，直到浏览器崩溃为止。

我能找到的唯一解决方案是在useEffect（）末尾输入带有常量的[]。

function getNestedObject(nestedObj, pathArr) {
  return pathArr.reduce(
    (obj, key) => (obj && obj[key] !== "undefined" ? obj[key] : undefined),
    nestedObj
  );
}

function Genres() {
  const [genreList, setgenreList] = useState(0);

  useEffect(() => {
    let results = "";
    axios({
      url: "https://api.themoviedb.org/3/genre/movie/list?",
      method: "GET",
      responseType: "json",
      params: {
        api_key: "00000000000",
        language: "en-US"
      }
    }).then(result => (results = result.data.genres));

    let a = [];
    for (let i = 0; i < 10; i++) {
      let name = getNestedObject(results, [i, "name"]);
      a.push(name);
    }
    setgenreList(a); …

我正在制作一个小的待办事项应用程序以了解有关 ReactJS 和 React Hooks 的更多信息。问题是我不明白我使用的list.map()有什么问题。它一直告诉我它不是一个函数。但是我一开始不明白我是如何将它用作函数的？

我一直在谷歌上查看我做错了什么。我尝试以多种方式更改我的代码，但我似乎无法弄清楚出了什么问题。一旦我单击“提交”按钮，它就会崩溃并给出TypeError: list.map is not a function错误消息。

function ToDoList() {
  const [list, setlist] = useState(["Test 1", "Test 2"]);
  const [newItem, setnewItem] = useState("");

  const handleChange = e => {
    setnewItem(e.target.value);
    console.log(newItem);
  };

  const handleSubmit = () => {
    setlist(...list, newItem);
  };

  return (
    <div>
      <input onChange={handleChange} />
      <button onClick={handleSubmit}>Submit</button>
      <ul>
        {list.map((item, index) => (
          <li key={index}>{item}</li>
        ))}
      </ul>
    </div>
  );
}

function App() {
  return (
    <div className="App">
      <AppTitle />
      <ToDoList …