时间戳

首页 > 解决方案 > React 路由器是正确的，但不能按预期工作

reactjs - React 路由器是正确的，但不能按预期工作

问题描述

我有一个带有以下输入的 React 应用程序：

import React, { Component } from 'react';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import Start from './Portal/Membership/Anonymous/Start';
import Register from './Portal/Membership/Anonymous/Register';
import NoMatch from './Portal/Membership/Anonymous/NoMatch';


const App = () => (
    <div className="App" style={{ height: "100vh" }}>
        <Router>
            <div>
                <Switch>
                    <Route exact path="/" component={Start} />
                    <Route exact path="/Register" Component={Register} />
                    <Route component={NoMatch} />
                </Switch>
            </div>
        </Router>
    </div>
);

export default App;

只有路径/有效，但如果我打开/Start页面，甚至什么都不会呈现空NoMatch。如果我导航到不正确的网址，NoMatch将呈现。

/如果我将默认组件更改为注册，注册组件将在位置呈现

标签： reactjsreact-router

解决方案

Component我搜索了所有网络并阅读了所有 React Router 文档，但没有找到任何东西，直到我不小心复制并粘贴了一行路由器并发现和之间有区别component！

我想知道为什么 react 不能识别Component属性（大写）并且在没有,和定义c时没有抛出异常！componentrenderchildren

请记住，如果您编写诸如<SomeComponent someBooleanAttribute="true" />React 之类的内容会向您发出消息警告，although true works here but you must write someBooleanAttribute={true} because someBooleanAttribute="false" will be recognized as true但对于这个更重要的问题，不会向开发人员显示任何警告或错误！

推荐阅读