路由器链接给出警告“链接是一个无效元素标签，不能有 `children` 或使用 `props.dangerouslySetInnerHTML`。”答案

【问题标题】：Router link giving warning " link is a void element tag and must not have `children` or use `props.dangerouslySetInnerHTML`."路由器链接给出警告“链接是一个无效元素标签，不能有 `children` 或使用 `props.dangerouslySetInnerHTML`。”
【发布时间】：2016-08-06 16:13:32
【问题描述】：

我是第一次使用 react-route。当我尝试这个时，它给了我这个警告并且它不起作用 "警告：链接是一个空元素标签，不能有children或使用props.dangerouslySetInnerHTML。检查Loginpanel的渲染方法。"

我的代码是这样的。

render() {

    return (

        <div >

            <input type="email" />
            <input type="password"/><br/>

         <link to="Index">   BLOCK
         </link>

        </div>

       )
    }
  }

而我的main.js是这样的

    render(
  <Router history={hashHistory}>

      <Route path="/" component={Loginpanel} >
    <Route path="Index" component={App}/>
      <Route path="Form" component={Form} />
          </Route>


    </Router>,
   document.getElementById('js-main'));

提前致谢。

【问题讨论】：

标签： reactjs react-router

【解决方案1】：

在 reactjs 中它的 Link 而不是链接。你可以试一次吗？

import {Link} from 'react-router';

【讨论】：

如果真有趣，您可以使用链接而不是链接，只是想提供帮助
对不起./.你是对的.. 是错误的.. 第一次。我没有阅读您的评论...我接受您的回答并给您点人，...谢谢伙计
是的，那是我的问题。在找到这个之前花了 15 分钟的调试时间。
感谢您的解决方案，这对我也有帮助

【解决方案2】：

把link改成Link

第一个字母大写。

【讨论】：

【解决方案3】：

作为 Harkirat Saluja 答案的补充：

渲染方法示例：

render() {

    return (

        <div>
          <Link to="Index">It Link, not link </Link>
       </div>
    )
}

【讨论】：

【解决方案4】：

如果您使用的是 react-router 版本 4，那么这是导入链接的正确方法

import { Link } from 'react-router-dom';

因为 React Router 项目现在已分解为几个不同的库

【讨论】：

【解决方案5】：

// 导入链接和div里面，{L}后面要大写

从'react-router-dom'导入{链接}；

渲染() {

return (
   <div>
      <Link to="Index">It Link, not link </Link>
   </div>
);

}

【讨论】：