javascript - react route 的大写情况

标签 javascript reactjs react-router

我正在开发一个非常简单的 react 应用程序,但是当我尝试使用路由器时,路径名总是首字母大写,我不知道为什么。

app.js

import React from "react";
import ReactDOM from "react-dom";
import Layout from "./pages/Layout"
import Basket from "./pages/Basket"
import { Router, Route, IndexRoute, hashHistory } from "react-router"

const app = document.getElementById('app');

ReactDOM.render(
    <Router history={hashHistory}>
    <Route path="/" component={Layout}>
        <IndexRoute component={ItemsList}></IndexRoute>
        <Route path="basket" name="basket" component={Basket}></Route>
    </Route>
    </Router>,
app);

Header.js

import React from "react";
import { Link } from "react-router"

export default class Header extends React.Component {
    render() {
        const { location } = this.props;
        const basketClass = location.pathname.match(/^\/basket/) ? "active" : "";
    return (
        <header>
            <nav class="navbar navbar-default">
                <div class="container">
                    <ul class="nav navbar-nav">
                         <li class={inventoryListClass}><Link to="/">Inventory</Link></li>
                        <li class={basketClass}><Link to="basket">Basket</Link></li>
                    </ul>
                </div>
            </nav>
        </header>
    );
    }
}

当我在路由参数中明确指定“篮子”时,现在有人知道为什么它使用大写字母“/篮子”吗?

谢谢。

Layout.js

import React from "react";

import Footer from "./Footer";
import Header from "./Header";

export default class Layout extends React.Component {

    render() {
        const { location } = this.props
        return (
            <div>
                <Header location={location} />
                <div class="container">
                    {this.props.children}
                </div>
                <Footer />
            </div>
        );
    }
}

最佳答案

好的,我发现了问题。我把大写字母“B”放入 <link to=Basket我的 header.js 中的这一行

<li class={basketClass}><Link to="Basket">Basket</Link></li>

所以这只是一种类型。抱歉各位。

关于javascript - react route 的大写情况,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38802448/

相关文章:

javascript - 在routes.js 中意外导入 token

javascript - 作为数据源返回到 jqueryui 自动完成的 JSON 对象应该是什么样子?

javascript - 这里的 input 如何获得 .value 以及什么是 ref?

javascript - 我如何在从表单获取用户输入的对象数组内部设置状态

javascript - Reactjs 路由未返回正确的结果

javascript - 访问App组件中的位置属性

javascript - AngularJs ng-repeat数组内部数组顺序子项

php - 抓取网页并检索 javascript 变量

python - Selenium (Python)+ react

react-router - react 路由器不更新浏览器的地址栏