时间戳

首页 > 解决方案 > 为什么在浏览器 URI 中直接更改路由时，CSS 样式会在 React 中消失？

css - 为什么在浏览器 URI 中直接更改路由时，CSS 样式会在 React 中消失？

问题描述

我有一个使用 npx create-react-app 创建的简单前端 React 应用程序。该应用程序正在使用 react-router-dom 路由。当我直接将浏览器中的URI从say更改为时，localhost:3000/它将localhost:3000/search导航到<Route>但没有呈现CSS；只是来自组件的 HTML。

直接在浏览器中导航时，如何确保 CSS 在新路由中呈现？我未来的目标是能够在新选项卡中复制和粘贴路线并导航到正确的页面并显示来自 API 的结果。

标签： cssreactjsreact-routerreact-router-dom

解决方案

Css 样式表需要在根级别或文件本身中导入。

使用时需要导入样式表，然后需要在组件或标签中使用相应的类名。

另一种在没有样式表的情况下设置 react css 的有用方法是使用线条样式

例如

<div style ={{float: "right", textAlign : "center"}}> </div>

编辑

在 react 项目中获取样式的一种非常简单的方法是安装引导程序。

然后可以为按钮和东西分配类名，例如

<div className = "jumbotron"></>

这将在项目周围留下一个灰色框。

<div className = "btn btn-primary"></>

这会给你一个蓝色风格的按钮。

您的应用程序中的任何更多信息或帮助让我知道并提供一些代码片段。

推荐阅读