下面有个代码。当我点击链接,如果它有类‘主页链接’,我想显示背景图像。如果它没有类,则不会显示任何图像。
的问题是:最初出现图像是因为css文件在点击没有类的链接之后就会消失,并且我不能通过单击包含类的链接返回图像。它与‘背景颜色’完美地工作,但不与‘背景-图像’。我该怎么解决呢?
import React, { Component } from 'react'
import { BrowserRouter as Router, Route, Redirect, NavLink } from 'react-
router-dom'
import Home f
我将activeClassName应用于<NavLink>,但当它出现在页面上时,它不会对其进行样式设置。取而代之的是,当链接被点击时,它的样式是链接,但是当单击被释放时,它会恢复。这是一个。我也尝试过activeStyle,但也是一样的。这是我的密码。
index.js
import React from 'react';
import ReactDOM from 'react-dom';
import {
Route,
NavLink,
BrowserRouter as Router,
Switch
} from
我有一个父组件,它简单地呈现导言文本的'p‘和一个名为'PortfolioMenu’的子组件
import React from 'react'
import PortfolioMenu from './PortfolioMenu'
const Portfolio = () => {
return (
<div className="wrapper2">
<p>
Here is an Introduction text
</p>
&l
activeClassName of React路由器NavLink在映射时不工作,如下面的代码所示。视图将来自其容器的链接作为映射它们的道具来接收。一切都很好,包括标准的className,但是activeClassName不能工作。当我在映射之外手动添加一个NavLink时,它可以工作,但是我找不到错误。任何帮助都很感激。
import React from "react";
import { NavLink } from "react-router-dom";
import styles from './style.scss';
clas
尝试制作一个网站的前端,这里是我的头的简单反应代码 import React, { Fragment } from 'react'
import { NavLink } from "react-router-dom";
import './Header.css';
function Header() {
return (
<nav>
<Fragment>
<h1>
Your NAME
</h1>
</Fragme
我有一个呈现菜单的组件: import React, { Component } from 'react'
import { BrowserRouter as Router, Route, NavLink } from 'react-router-dom'
import Intro from './Intro'
import Houses from './Houses'
import PortfolioPage from './PortfolioPage'
import Cronology from '
这是我的主页:
import React from 'react';
import TopNav from '../components/nav/TopNav';
import LeftNav from '../components/nav/LeftNav';
import Title from '../components/nav/Title';
const Home = () => {
return (
<div className="home">
<To
我刚开始建立一个新的React项目,遇到了一个问题,我不知道如何解决它。
在默认导出之后,我的静态组件是null。在我把它分成不同的文件之前,所有文件都能很好地工作。如果我将静态AddExpense组件移回AppRoute.js文件,它仍然工作。
这里有什么问题?
import React from 'react';
const AddExpensePage = () => (
<div>
This is from my add AddExpensePage
</div>
);
export default Ad
当我在本地服务器上重新加载我的应用程序时,一切正常。但是当我在gh-pages上重新加载页面时,我得到了一个404错误。它不会在主页上执行此操作,但在其他两个页面上会执行此操作。这与它被远程托管的事实有关吗?我是React Router的新手。任何帮助都会是appreciated.Here是相关的代码和下面我的应用程序的链接:
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
class App extends Component {
render() {
ret
我试图使用react路由器-dom 4,但无法直接导航到路由.
下面是我的代码示例:
let Test = (props) => (<div>This is a test component</div>);
let About = (props) => (<div>About us</div>);
class App extends Component {
render () {
return (
<Router>
<div>
<nav
我正在学习React路由器,并遵循,一切都很清楚,并且按照指示工作(谢谢作者),除了一个突出显示active NavLink的问题之外。
查看css文件并注意.current类:
nav ul {
list-style: none;
display: flex;
background-color: black;
margin-bottom: 20px;
}
nav ul li {
padding: 20px;
}
nav ul li a {
color: white;
text-decoration: none;
}
.current {
border-b