next 相关问题

我有接下来的 13 个应用程序，我正在使用 zustand 作为我的状态管理器现在我有一个简单的布局，如下所示我有接下来的 13 个应用程序，我正在使用 zustand 作为我的状态管理器现在我有一个简单的布局，如下所示 <MainProvider> <div className="min-h-screen flex flex-col"> <Navbar></Navbar> <main className="layout flex-1 flex flex-col">{children}</main> <Footer></Footer> </div> </MainProvider> 对于 MainProvider 组件，它看起来像这样，我计划将所有提供程序放在这里并加载 zustand 存储的初始数据 import React from "react"; import ReactQueryProvider from "./ReactQueryProvider"; import VocabService from "@/services/vocab.service"; import { useVocab } from "@/store"; export type MainProviderProps = { children: React.JSX.Element; }; const getInitialVocab = async () => { const [productCategories] = await Promise.all([ VocabService.getProductCategories(), ]); useVocab.setState({ productCategories }); }; const MainProvider = ({ children }: MainProviderProps) => { getInitialVocab(); return <ReactQueryProvider>{children}</ReactQueryProvider>; }; export default MainProvider; 这是服务器组件，正如你在这里看到的，我正在设置所有承诺解析后的状态，并且效果非常好对于页面组件 "use client"; import { useEffect, useState } from "react"; import Product from "@/components/Product"; import Breadcrumbs from "@/components/elements/Breadcrumbs"; import { useVocab } from "@/store"; const Home = () => { const productCategories = useVocab(); useEffect(() => { console.log(useVocab.getState(), new Date().getTime()); console.log(productCategories); }, [productCategories]); return ( <> <div className="breadcrumbs bg-gray-200 py-4"> <div className="container mx-auto"> <Breadcrumbs items={[ { name: "a", link: "a" }, { name: "b", link: "b" }, ]} /> </div> </div> <div className="page flex-1 bg-red-200"> <div className="container mx-auto"> <h1>page</h1> <div className="flex"> <Product currency="egp" image="" name="test" price={123} rate={1} reviews={24} ></Product> </div> </div> </div> </> ); }; export default Home; 它是一个客户端组件，我尝试使用 useVocab.getState 函数加载状态并使用返回值，但客户端上没有任何内容获取初始数据初始数据位于服务器上，但客户端上没有任何内容你觉得有什么问题吗？我没有足够的声誉来发表评论，但是这个视频应该有帮助。

javascript reactjs next.js zustand next

回答 1 投票 0

Next.js not-found.js 文件显示空白页面而不是 404 消息

我正在使用 Next.js v13.4.19 进行练习应用程序，使用应用程序路由器模式。当访问不存在的路由时，应用程序文件夹中存在的 not-found.js 页面不会呈现 404 页面，...

javascript next 404-page

回答 2 投票 0

使用 Next.js 应用路由器实现受保护的路由有哪些有效方法？ [已关闭]

我正在努力通过实施受保护的路由来增强 Next.js 应用程序的安全性。我想听听开发人员在以下情况下发现成功的不同策略或方法

javascript reactjs next-auth next-router next

回答 1 投票 0

如何在 React 上按键播放声音

我的工作框架：Next.JS v13.4.19 我正在做什么：尝试在按下某个键时播放声音片段。我是怎么做的：函数handlePlay()查找某些按键并触发play()