Javascript 如何修复：React Context-TypeError:对象不可编辑（无法读取属性符号（Symbol.iterator））

我尝试了一些解决方案，特别是

我尝试更改TodosContext.js文件中的值。。这也没用。。 我尝试过的另一件事是从另一个组件调用useContext（）函数，这也不起作用

这是我的密码。 App.js：

import React，{useState，useContext}来自“React”；
从“./components/TodoList”导入TodoList；
从“./components/NewTodo”导入NewTodo；
从“./components/contextapi/TodosContext”导入{TodosProvider，TodosContext}；
函数App（）{
const[input，setInput]=useState（“”）；
const[todos，setTodos]=useContext（todoContext）；
常数handleInput=（e）=>{
设置输入（如目标值）
}
常数todoAdd=（e）=>{
如果（e.key=='Enter'）{
塞托多斯(
[…todos，{content:input，id:Date.now（），completed:false}]
)
设置输入（“”）
}
}
const_todoRemove=（id）=>{
常量newTodos=todos.filter（todo=>todo.id！==id）
setTodos（新潮）
}
返回(
ToDo Manager |上下文API
);
}
导出默认应用程序；

TodosContext.js：

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

export const TodosContext = createContext()

export const TodosProvider = ({ children }) => {
    const [todos, setTodos] = useState([]);
    return (
        <TodosContext.Provider value={[todos, setTodos]}>{children}</TodosContext.Provider>
    )
}

import React，{useState，createContext}来自“React”；
export const todoContext=createContext（）
export const todoProvider=（{children}）=>{
const[todos，setTodos]=useState（[]）；
返回(
{儿童}
)
}

TodoList.js：

import React, { useContext } from 'react';
import Todo from './Todo';
import RemoveTodoFromList from './RemoveTodoFromList';
import { TodosContext } from './contextapi/TodosContext'

function TodoList() {

    const [todos, setTodos] = useContext(TodosContext);

    return (
        <div>
            {todos.map(todo => (
                <div>
                    <Todo key={todo.id} todo={todo} />
                </div>
            ))}
        </div>
    )
}

export default TodoList

import React，{useContext}来自“React”；
从“/Todo”导入Todo；
从“/RemoveTodoFromList”导入RemoveTodoFromList；
从“./contextapi/TodosContext”导入{TodosContext}
函数TodoList（）{
const[todos，setTodos]=useContext（todoContext）；
返回(
{todo.map（todo=>(
))}
)
}
将默认值导出到列表

---

我真的在为这件事苦苦挣扎，我花了一整天的时间来弄清楚到底出了什么问题。。谢谢

我们在评论中修复了它

createContext

需要一个对象作为定义上下文的参数。 在您的例子中，它应该是

export const TodosContext=createContext（[[]，（）=>{}]）

。

---

因此，应用程序知道元组的第一个元素是数组，因此是可编辑的。

我们在注释中修复了它

createContext

需要一个对象作为定义上下文的参数。 在您的例子中，它应该是

export const TodosContext=createContext（[[]，（）=>{}]）

。

---

因此，应用程序知道元组的第一个元素是数组，因此是可编辑的。

您是否可以尝试

export const TodosContext=createContext（[[]，（）=>{}]）

。这将在创建时设置默认值。@Stutje Yeah man！它起作用了！我真的很感激，但是有必要一直编写这种语法吗？还是就我而言？你应该总是在

createContext

中给出一个默认值，或者至少指定它，这样你就不会遇到那些恼人的错误：）很高兴我能帮你尝试

export const-to-osContext=createContext（[[]，（）=>{}]）

。这将在创建时设置默认值。@Stutje Yeah man！它起作用了！我真的很感激，但是否有必要一直编写这种语法，还是就我而言？您应该始终在

createContext

中提供默认值，或者至少指定它，这样您就不会遇到那些恼人的错误：）很高兴我能帮上忙

import React, { useContext } from 'react';
import Todo from './Todo';
import RemoveTodoFromList from './RemoveTodoFromList';
import { TodosContext } from './contextapi/TodosContext'

function TodoList() {

    const [todos, setTodos] = useContext(TodosContext);

    return (
        <div>
            {todos.map(todo => (
                <div>
                    <Todo key={todo.id} todo={todo} />
                </div>
            ))}
        </div>
    )
}

export default TodoList