react router dom失败的属性类型：类型为字符串的属性'exact'无效`

Question

当我尝试使用

ReactDOM.render(
    <Provider store={appStore}>
        <ConnectedRouter store={appStore} history={history}>
            <BrowserRouter>
                <Switch>
                    <Route exact={"true"} path="/" component={App}/>
                    <Route render={() => <h1>404, not found</h1>} />
                </Switch>
            </BrowserRouter>
        </ConnectedRouter>
   </Provider>,
document.getElementById('root'));

浏览器控制台说我接下来：

警告：失败的道具类型：提供给路线的字符串类型的无效道具精确，应为布尔。路由内（src/index.tsx:19）索引。js:1452

在上一个警告之后的以下警告是绝对符合文本逻辑的

警告：对于非布尔属性exact，接收到true。

如果要将其写入DOM，请传递一个字符串：exact=“true”或exact={value.toString（）}。在应用程序（由Context.Consumer创建）的div（由Context.Consumer创建）的div（由Context.Consumer创建）的头（由App.tsx:11）中的链接（由Context.Consumer创建）中的链接（在App.tsx:25）中在路由器（由BrowserRouter创建）中的交换机（在src/index.tsx:18）中在BrowserRouter（由ConnectedRouter创建）中的src/index.tsx:17中（位于src/index.tsx:16）在提供程序中（位于src/index.tsx:15）

所描述的示例位于开源prj中https://github.com/gyerts/react/blob/master/starters/typescript-scss-redux/src/index.tsx#L19




Answer 1

您可以只使用exact属性，而不使用其值，如下所示：

<Route exact path="/" component={App}/>

Answer 2

你可以用精确的。你不必移除它。

就这样,

 ReactDOM.render(
  <Provider store={appStore}>
     <ConnectedRouter store={appStore} history={history}>
         <BrowserRouter>
             <Switch>
                 <Route exact={true} path="/" component={App}/>
                 <Route render={() => <h1>404, not found</h1>} />
            </Switch>
         </BrowserRouter>
    </ConnectedRouter>
   </Provider>,
  document.getElementById('root'));

你可以传递true给它，它可以解决你的问题。你不必删除确切的。

Answer 3

问题是出于某种原因，我将属性exact传递给链接组件。

<Link exact to="/about">About the author</Link>

所以我删除了确切的属性，警告消失了。

<Link to="/about">About the author</Link>