next.js 相关问题

Next.js是服务器呈现的React应用程序的简约框架。

将 Clerk SVIX Webhook 连接到 Firebase HTTPS 云功能

场景：您有一个使用 clerk 进行身份验证的 NExtJS 项目。您希望通过 google 云功能和 Clerk Webhooks 将其连接到 Firebase，以进行正确的用户管理。你怎么做呢。 SVIX

firebase next.js firebase-authentication google-cloud-functions clerk

回答 1 投票 0

如何让切换开关显示/隐藏数组对象？

我试图在切换开关时显示/隐藏描述。我还想首先检查一下开关。当选中该开关时，应显示每个结果的描述。每个结果...

javascript reactjs next.js tailwind-css

回答 1 投票 0

在react和typescript文件中使用外部JS函数

在我的react/next.js/typescript 文件中，我在useEffect 中加载YouTube iframe API，如下所示使用效果（（）=> { const 标签 = document.createElement('script'); tag.src = "https://www.

reactjs typescript next.js

回答 1 投票 0

VLibras 无法渲染，因为库内的属性未定义

我正在使用 React 和 Next.js 构建一个 Web 应用程序，并尝试将 VLibra 添加到我的网站。问题是，我总是想加载 VLibras，它总是显示：读取未定义的属性 (r...

reactjs typescript next.js

回答 1 投票 0

下一个身份验证会话在开发环境中消失数据

我正在我的 next.js 项目中使用 next auth，但在开发过程中，如果服务器刷新，那么 sessio 会立即丢失其中的数据，如果我更改为浏览器中的另一个选项卡，然后

javascript reactjs authentication next.js next-auth

回答 2 投票 0

useRouter 为空； router.isready 似乎不适用于 nextjs 13

我正在尝试下一个 js 13，但遇到了一些无法修复的错误。我的代码：从 'next/navigation' 导入 { useRouter }；异步函数 getCheckoutInfo() { const 路由器 = useRouter(); 如果（路由器.是...

reactjs next.js router

回答 4 投票 0

在 Next.js 中将服务器组件包装在客户端中

我有一个使用 graphql 和 apolloq 将数据添加到 json 的表单。我正在使用 typescript 和 next.js 采取行动。获取有关服务器客户端组件的冲突错误。在表单组件中使用钩子...

reactjs typescript next.js graphql apollo

回答 1 投票 0

React 和 Tailwind CSS 样式用于制作特殊的卡片组件

这是我想用React做的，它是一个项目组件：我尝试了各种方法来做到这一点，但似乎无法找到正确的帮助文档。我也在努力使用 next/...

css reactjs next.js tailwind-css

回答 1 投票 0

传递数据对象动态路由nextjs

我在另一条路线中传递对象时遇到此错误。我的目标是，当单击编辑按钮时，我将被路由到编辑页面，并将该行的数据传递给编辑...

reactjs next.js

回答 1 投票 0

NEXT.js 14 将数据从页面传递到其他页面

我对编程世界相当陌生，特别是 next.js，我有一个页面，我在其中执行获取并获取响应，该响应是包含数据的对象，当获取成功时，...

next.js react-hooks httpresponse

回答 1 投票 0

NextJS / Dirctus - 使用 updateMe SDK 函数更新当前用户

系统： NextJS：14.2.1 下一个验证：4.24.7 直接：10.10.5 问题我想以简单的形式更新当前用户的详细信息。我正在使用 Directus 提供的 updateMe 函数。提交时...

rest next.js sdk next.js13 directus

回答 1 投票 0

如何在nextjs中使用slug url

我在nextjs工作，我正在尝试制作“动态路线”，我想点击后我的网址应该像“myurl.com/article/55” 为此，我使用以下“链接标签” 我在 nextjs 工作，我正在尝试制作“动态路线”，我想点击后我的网址应该像“myurl.com/article/55” 为此，我使用以下“链接标签” <Link href={{pathname: "article/[id]",query: { id: post.id },}}> <a className="rdmre-btn"> Read More</a> </Link> 这是我在文件（“pages/article/[slug].js）”中的代码，我错在哪里？我希望每当我点击任何博客时，博客详细信息页面都应该打开。 import Axios from "axios"; import { useRouter } from "next/router"; import Link from "next/link"; import LatestBlogs from "../../components/LatestBlogs/LatestBlogs"; const Post = ({ post }) => { const router = useRouter(); const htmlString = post.description_front; if (router.isFallback) { return <div>Loading...</div>; } return ( <> <header className="bgbanner blog_header"> <div className="container cont"> <div className="header"> </div> </div> <div className="container "></div> </header> <section> <div className="container Blog_page_sidebar"> <div className="blog_details"> <div className="blog_image"> <img src={post.image} /> </div> <div className="blog_heading"> <h2>{post.title}</h2> </div> <div className="blog_detail"> <div className="product-des" dangerouslySetInnerHTML={{ __html: htmlString }} /> </div> </div> </div> </section> </> ); }; export default Post; export const getStaticProps = async ({ params }) => { const { data } = await Axios.get( `https://myurl.com/api/blogbyids/${params.id}` ); const post = data; return { props: { post, }, }; }; export const getStaticPaths = async () => { const { data } = await Axios.get( "myurl.com/admin-panel/api/blogs" ); const posts = data.slice(0, 10); const paths = posts.map((post) => ({ params: { id: post.id.toString() } })); return { paths, fallback: true, }; }; [slug] 用于嵌套路由。但正确的是[...slug].js（info）示例：myurl.com/article/[id]/[otherid] 在上面的例子中我们可以看到 [id] 中可以嵌套子元素。您可以根据需要命名此参数。如果你想要你的结构为myurl.com/article/55，你需要有如下结构：在您的 pages 文件夹中：您创建了一个文件夹article (pages/article) 您创建 2 个文件：index.js（或 .tsx）和 [id].js（您可以命名为 [slug].js 或 [specialId].js - 无论名称如何之后，您将获得带有创建的参数名称的信息。这里是代码示例（URL：myurl.com/article/55；文件：pages/article/[pid].js） import { useRouter } from 'next/router' const Post = () => { const router = useRouter() //same name as name of your file, can be [slug].js; [specialId].js - any name you want const { pid } = router.query //result will be '55' (string) return <p>Post: {pid}</p> } export default Post 在接下来的 14 中，您将需要使用 useParams，因为这将为您提供 URL 中的变量/slug。 https://nextjs.org/docs/app/building-your-application/routing/dynamic-routes import { useParams } from "next/navigation"; const Post = () => { // folder structure /posts/[pid] const params = useParams(); // example URL /posts/123 const { pid } = params; // pid will equal 123 return <p>Post: {pid}</p> } export default Post

javascript reactjs next.js

回答 2 投票 0

Next.js 项目使用哪种 Headless CMS 来确保速度和安全性？

我正在开发一个项目，该项目将有 2 个前端 - 用于客户和管理员。管理前端用于编辑网站内容。我想在这个 Next.js 项目中使用 Headless CMS。作为网页

reactjs next.js content-management-system headless

回答 2 投票 0

Next JS 14+ 自动将布局文件应用到页面，无需导入它并将其包裹在页面内容中

当我在应用程序目录中创建layout.jsx文件时，我发现布局会自动应用于我创建的页面，而无需导入它并将其包裹在每个页面的内容周围。 ...

reactjs next.js

回答 1 投票 0

nexjts 应用程序已部署，但在部署的服务器上损坏

我正在 Render 上运行 nextjs 14 应用程序。我设法解决了所有问题，并且应用程序构建得很好。在本地它构建得非常好并且工作得很好。我现在遇到的问题...