在依赖于 URL 的上下文中创建初始状态,在 NextJS 中未定义窗口

用户3226932

我正在尝试检测我的 nextjs 应用程序中的 URL 路径,并根据 中的 url 路径设置初始状态context,但未定义窗口。我知道window在客户端渲染之前不会被定义,但是如果我想将初始状态传递到上下文中,我会把它放在哪里?

import React, {createContext, useReducer} from "react";
import Reducer from './reducer'

const initialState = {
  'about': window.location.pathname == 'about' ? true : false
};

const Store = ({children}) => {

    const [state, dispatch] = useReducer(Reducer, initialState);


    return (
        <Context.Provider value={[state, dispatch]}>
            {children}
        </Context.Provider>
    )
};

export const Context = createContext(initialState);
export default Store;

马哈帕特拉

您可以访问RouterContext,您可以使用pathname它提供价值。

import { useRouter } from 'next/router';

const Store = ({children}) => {
  const router = useRouter();

  const [state, dispatch] = useReducer(Reducer, {
      about: router.pathname === '/about'
  });

  // rest of the logic

}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何调用依赖于Thymeleaf中输入的url?

创建依赖于选项的自定义记录器和依赖于记录器的选项验证器时的循环依赖项异常

如何初始化依赖于主 Tkinter 窗口的 Tkinter 画布

Reactjs:如何从依赖于子组件状态的父组件中的方法访问子组件的状态

创建依赖于其元素之一的用户定义类型

如何创建依赖于Spring Bean的自定义Spring PropertySource

在Spring javaconfig中,如何初始化依赖于@Service的@Bean

使类中的函数指针依赖于初始化值

在 React 组件中在哪里设置依赖于道具的状态?

使用cumsum创建一个依赖于Matlab中先前元素的变量

如何在RxJS中创建依赖于另一个Observable的Observable

创建依赖于 onMounted() 生命周期钩子中的变量的计算属性

当组件依赖于 ViewModel 提供的某些数据时,如何在 JetpackCompose 中创建 @Preview

创建依赖于 Django 中另一个模型的模型 ChoiceField

如何处理视图依赖于 MVVM 上下文中的多个模型的情况?

创建依赖于变量的列表

创建依赖于Beta的nuget

如何创建依赖于输出的sliderInput?

如何创建不依赖于ASP.NET Core中的声明的自定义Authorize属性?

使闪亮的应用程序UI依赖于URL参数

如何让我的 AJAX url 依赖于 jquery 条件?

在Swift中从UIViewController继承的类中是否可以初始化依赖于另一个变量?

如何防止依赖于记忆的父组件状态的子组件中不必要的重新渲染

如果方法依赖于 React 中的状态变量,如何将方法传递给子元素

如何在r的生存包中的coxph模型中创建一个依赖于时间的协变量时间?

使用依赖于其他两个列的元素创建data.frame列(在R中)

我想在gradle,AS中创建一个任务DependOn assembleRelease,但是该任务还依赖于assembleDebug。

如何修复Nextjs中的“未定义窗口”

Eclipse 插件依赖于 jar,因此从依赖项中创建了一个插件:它的依赖项怎么样?