reactjs 相关问题

我使用nextjs Link时SEO/Google Crawler能找到底层url吗？

Nextjs Link SEO 友好吗？或者我应该如何以 SEO 友好的方式使用它？ 我的登陆页面中有一堆链接，每个链接都路由到我网站上的不同页面，所以就像 Nextjs Link SEO 友好吗？或者我应该如何以 SEO 友好的方式使用它？ 我的目标网页中有一堆 Link，每个 Link 都会路由到我网站上的不同页面，所以就像 <Link href='/california-hotels'> California </Link> <Link href='/new-york-hotels'> New York </Link> 我真正希望的是谷歌爬虫可以发现每个页面，即www.mysite.com/california-hotelswww.mysite.com/new-york-hotels我只是不确定它们是否会被发现。我确信如果它是一个标签，即<a href="www.mysite.com/california-hotels">California</a>，那不会有问题，因为网址已拼写出来。 当我使用Link时，Google爬虫是否能够找到实际的url？谢谢你 是的，nextjs 在幕后仅使用锚标记。如何通过检查元素来验证它。 只要链接在 DOM 中，Google bot 就能够抓取它们。

使用“testing-library”中的“screen”和“jsdom”时，如何并行运行测试？

我正在将react-testing-library与jsdom和vitest一起使用（通过环境使用jsdom）。我正在尝试在一个文件中运行多个单元测试，但屏幕变量似乎具有所有渲染的输出

“无法加载资源：服务器响应状态为 404（未找到）”，但页面仍然加载

当我从导航菜单中按下仪表板按钮时，仪表板页面会加载，即使如此，它仍然在控制台中显示“404”。当我登录并按 Enter 键时，它会转到相同的网址，但...

修复 NextJs 应用程序中找不到页面错误的方法

我有以下文件夹结构 源代码/ ├── 应用程序/ │ ├── 页数/ │ │ ├── 认证/ │ │ │ ├── 注册/ │ │ │ │ └── page.tsx │ │ │ └── 登录/ │ │ │ └── 页码....

动态绑定依赖于父列表项更改的选择列表在react js和node js中不起作用

我有2个关于sbu列表和部门列表的选择列表。我想根据 sbu 列表项的 onChange 事件选择值更新部门列表。但根据我的代码，有时它只能工作......

我可以使用全局变量而不是 React.Context 在这里传递常量 props 吗？

我想知道在我的用例中，全局共享变量有利于上下文的缺点是什么： 该变量的值将在第一次渲染时设置一次 这个变量的值...

我正在将 tailwind 类字符串从 utils 导入到应用程序文件夹中的索引页面，但它不起作用。直接在应用程序文件夹中用作类名是可行的

utils/responsiveBox const responsiveBoxClass = "border-2 border-[红色] xxsmScr:border-tahitiii xsmScr:border-[蓝色] smScr:border-[绿色] midScr:border-[橙色] bigScr:border-[白色] BigScr:b .. .

使 BarChart 响应 MUI-X 和 React

我正在尝试使此条形图具有响应性，截至目前它具有固定的高度（500x200px）。该文档非常模糊，并说将 BarChart 包装在 ResponsiveChartContainer 中，但我......

React Native init 错误找不到模块->node_modules act-native\package.json'

所以，当我尝试使用->react-native init abc 创建一个新项目时。 一切都很顺利，直到它说找不到包 json。 然后它最终在新的 abc fo 中只有包 json...

属性未正确传递到子组件

我有一个简单的网站，它从丹麦国家数据提供商 SDFI 加载与房产相关的数据。 我在将正确的值从母组件传递到子组件时遇到问题。 我的代码

我的React不会在移动设备上渲染来自我的API的数据，而是在PC上渲染，

我正在开发这个项目，从我的restful api获取数据并用它来更新状态。它在个人电脑/笔记本电脑上完美运行，但是当我在移动设备上访问它时，它不会显示任何来自...

像下面这种情况，如何在线制作网站？

不明白如何部署 您好，我是一名初学者，正在学习 .net 后端和 React js 前端， 例如，我在Azure等云中部署后端代码和sql数据库。我可以离开吗...

Next.js 中间件没有在生产环境中正常执行

我最近将我的项目从 Next.js 14 的页面路由器迁移到应用程序路由器。我们使用两种不同的布局，因此我们的应用程序目录如下所示： |-- 应用程序 |---（主要） |---- 拉...

断言错误[ERR_ASSERTION]：表达式计算为假值：(0, _assert().default)(node.type === OPTION)

at RequestGraph.invalidateOptionNodes（食品订购应用程序 ode_modules@parce

如何在 Vercel 上通过节点运行构建而不在 URL 中使用“/api”？

我正在尝试在 vercel 上部署我的 React 应用程序。但我想使用节点服务器运行我的构建。 因为我必须在我的节点应用程序中使用 prerender.io。 这样预览就可以带有动态值......

storybook 找不到基于 chakra-ui 的组件

我正在尝试故事书和脉轮用户界面。 下面是我如何构建我的文件夹， 模块. 导出 = { “故事”：[ “../src/**/*.stories.mdx”, “../src/**/*.stories....

React ag 网格条件单元格渲染器

我希望 prop cellRenderer: 'agGroupCellRenderer' 有条件地工作。 前任， { headerName: '测试名称', valueGetter: 参数 => { 返回 .....; }, 细胞渲染器：'

使用地图滑块不起作用时反应流畅

为什么使用此功能时反应光滑滑块不起作用： { mockEventInfoArr.map((el => ( 为什么使用此功能时反应光滑滑块不起作用： <Slider className="mb-24" {...settings}> { mockEventInfoArr.map((el => ( <div onClick={() => handleOpenEvent(el)}> <li className="flex-center fd-col"> <p className="mb-12 fw-600 color-main">{el.name}</p> <p className="fs-small">{formatRelative(el.start, new Date(), { locale })}</p> </li> </div> ))) } </Slider> 但是当我使用它时它起作用了...... <Slider className="mb-24" {...settings}> <div onClick={() => handleOpenEvent()}> <li className="flex-center fd-col"> <p className="mb-12 fw-600 color-main">{'asdsda'}</p> <p className="fs-small">{formatRelative(new Date(), new Date(), { locale })}</p> </li> </div> <div onClick={() => handleOpenEvent()}> <li className="flex-center fd-col"> <p className="mb-12 fw-600 color-main">{'asdsda'}</p> <p className="fs-small">{formatRelative(new Date(), new Date(), { locale })}</p> </li> </div> </Slider> 我做错了什么？ 这是我使用地图时的图像 在此输入图片描述 €：这是我的设置 const settings = { dots: true, infinite: true, autoplay: true, speed: 1000, initalSlide: 1, autoplaySpeed: 5000, slidesToShow: 1, slidesToScroll: 1, }; 在 React 中使用 .map 时，您需要在地图中的每个元素上有一个唯一的 key。您可以使用索引或 uuid 或任何。地图中的 key 有助于在重新渲染时做出反应并识别元素和变化。 <Slider className="mb-24" {...settings}> {mockEventInfoArr.map((el, i) => ( <div key={i} onClick={() => handleOpenEvent(el)}> <li className="flex-center fd-col"> <p className="mb-12 fw-600 color-main">{el.name}</p> <p className="fs-small">{formatRelative(el.start, new Date(), { locale })}</p> </li> </div> ))} </Slider>;

React 路由器子路由将其重定向到带有参数的错误网址

如果使用react-router v6缺少正确的路径，我正在尝试创建重定向路径 这是我的路线 }> 如果使用react-router v6缺少正确的路径，我正在尝试创建重定向路径 这是我的路线 <Route path='/recipe/:id' element={<RecipePage />}> <Route index element={<Navigate to='/recipe/:id/ingredients' replace />}/> <Route path='/recipe/:id/ingredients' element={<Ingredients />} /> <Route path='/recipe/:id/instructions' element={<Instructions />} /> </Route> 如果网址中缺少单词 ingredients 或 instructions，我想重定向到正确的路径。 当网址为http://localhost:5173/recipe/5431/时的示例，我想将其重定向到http://localhost:5173/recipe/5431/ingredients 但是上面的代码不断重定向我http://localhost:5173/recipe/:id/ingredients而不是http://localhost:5173/recipe/5431/ingredients 我的代码有什么问题？ 您不需要嵌套路由中的完整路径。考虑以下几点： <Route path='/recipe/:id' element={<RecipePage />}> <Route index element={<Navigate to='ingredients' replace />}/> <Route path='ingredients' element={<Ingredients />} /> <Route path='instructions' element={<Instructions />} /> </Route>

如何将现有的React Native项目迁移到React Native TVOS

使用React Native tvos，我想聚焦之间的选项卡。 我可以使用 React Native tvos 创建新项目，但无法转换现有项目。当我尝试运行 npm 时，我react-native@npm:react-...