你在这里有几个问题：

1. 在renderList您滥用React.Fragment. 它应该用于包装多个 DOM 节点，以便组件只返回单个节点。您将各个段落元素包装在各自的 Fragment 中。
2. 每次迭代 a 时都需要返回一些东西map。这意味着您需要使用return关键字。（有关箭头函数语法的更多信息，请参阅此问题。）
3. 您的代码将无限更新，因为useEffect正在更新其自己的钩子状态。为了解决这个问题，您需要包含一个数组作为第二个参数，useEffect这将告诉 React 只有在给定数组更改时才使用该效果。

这是它应该看起来的样子（经过一些重新格式化）：

import React, { useState, useEffect } from 'react';

const TodoList = () => {
  let updatedList = useTodoListState({
    title: "task3", completed: false
  });

  return (
    <React.Fragment> // #1: use React.Fragment to wrap multiple nodes
      {
        updatedList.map((item) => {
          return <p key={item.title}>{item.title}</p> // #2: return keyword inside map with braces
        })
      }
    </React.Fragment>
  )
}

function useTodoListState(state) {
  const [list, updateList] = useState([
    { title: "task1", completed: false },
    { title: "task2", completed: false }
  ]);

  useEffect(() => {
    updateList([...list, state]);
  }, [...list]) // #3: include a second argument to limit the effect

  return list;
}

export default TodoList;

编辑：
虽然我已经测试过上述代码有效，但最终最好重新设计结构以updateList从useEffect另一个变量中删除或实现另一个变量来控制更新。