import React, {Component} from "react";
import Demo1 from". / demo1.js"
import". / App.css"
import {BrowserRouter as Router, Route} from "react-router-dom";
import A from". / main/a.js"
import B from". / main/b.js"
import C from". / main/c.js"
import Nav from". / nav.js"
var arr = [< span className= "margin-r" > 1 , 2 ];
class App extends Component {
render () {
return (
<div className="App">
<Router>
<div>
<Nav/>
<Route exact path="/" component={A} />
<Route path="/b" component={B} />
<Route path="/c" component={C} />
</div>
</Router>
<header className="App-header">
<Demo1 name="huxiang"/>
{arr.map(function(name,key){
return <p key={key}>{name}
})}
</header>
</div>
);
}
}
import React from "react";
import {NavLink} from" react-router-dom";
export default class nav extends React.Component {
render () {
return(
<div>
<li><NavLink to="/">A</NavLink ></li>
<li><NavLink to="/b">B</NavLink ></li>
<li><NavLink to="/c">C</NavLink ></li>
</div>
);
}
}
PP+ nav.js
=
Why Nav navigation components must be written in Router components wrapped
Router NavLink Route what exactly is the relationship between them