arr[Symbol.iterator] 不是使用带有上下文的 useState 的函数

Posted 2023-04-14

【中文标题】arr[Symbol.iterator] 不是使用带有上下文的 useState 的函数

【英文标题】：arr[Symbol.iterator] is not a function when using useState with context

【发布时间】：2020-07-18 15:55:58

【问题描述】：

我想在我的上下文中使用反应状态。它看起来像这样：

export const App = () => 
  const [value, setValue] = useState("test");
  return (
    <BrowserRouter>
      <Switch>
        <ViewContext.Provider value=value, setValue>
          <Route path="/" render=(props) => <AdminLayout ...props /> />
          <Route
            path="/Dashboard"
            render=(props) => <AdminLayout ...props />
          />
        </ViewContext.Provider>
      </Switch>
    </BrowserRouter>
  );


export default App;

我所有的出口都在那里。然后我像这样在我的索引中调用：

ReactDOM.render(
  <App></App>,
  document.getElementById("root")
);

如果我使用带有例如：value="Test" 的上下文，这确实有效，但是当我尝试将它与状态一起使用时，它不起作用。有什么想法吗？

【参考方案1】：

export const App = () => 
  const [value, setValue] = useState("test");
  return (
    <BrowserRouter>
      <Switch>
        <ViewContext.Provider value=value> <----- you have to use like this
          <Route path="/" render=(props) => <AdminLayout ...props /> />
          <Route
            path="/Dashboard"
            render=(props) => <AdminLayout ...props />
          />
        </ViewContext.Provider>
      </Switch>
    </BrowserRouter>
  );


export default App;

【讨论】：

你能分享你的代码的codeandbox链接吗？你的问题陈述很模糊。所以请明确说明

我不能分享它，因为你必须登录到某些服务器才能运行代码。但没有比这更多的了。代码在没有useState的情况下运行完美，但是一旦我使用它，它就会崩溃......

用单括号检查 value..else 试试这样： //你的代码在这里 跨度>

是的。括号确实有效:-)但是，我无法从另一个组件设置值...

upvote 我的代码然后请 :) 另一个组件是什么意思？上面这个不是你分享的sn-p吗？