我们应该如何在Next.js 13中使用React的Context API?

rt4zxlrg  于 2022-11-05  发布在  React
关注(0)|答案(1)|浏览(333)

我们在next.js12应用中使用了react的context API。
我们想升级到next.js 13。
我们得到这个错误:
创建上下文不是函数
对于此代码:

import React from 'react'

const SiteContext = React.createContext()

export default SiteContext

我们现在该怎么办?我在网上找不到这方面的资源。
我们还需要在服务器上使用Context API,因为SEO很重要,我们不想在客户端上呈现。

jrcvhitl

jrcvhitl1#

问题是您需要“use client”指令。
由于您的import语句,错误被取消。将import更改为import { useContext } from 'react',您将得到以下错误:
您正在导入一个需要createContext的组件。它只能在客户端组件中工作,但其父组件都没有标记“使用客户端”,因此默认情况下它们是服务器组件。
checkout beta docs for more details,但基本上,app目录中的所有组件都是服务器组件。对于客户端组件,您需要使用指令。

"use client"

import React from 'react'

const SiteContext = React.createContext()

export default SiteContext

相关问题