Router link giving warning "is a void element tag and should not have` children` or use `props.dangerouslySetInnerHTML`."

Question

I use the first time. when I try to do this, it gives me this warning and it doesn’t work "Warning: the link is a void element tag and should not have children or use props.dangerouslySetInnerHTML . Check the Loginpanel rendering method."

my code is as follows.

 render() { return ( <div > <input type="email" /> <input type="password"/><br/> <link to="Index"> BLOCK </link> </div> ) } } 

and my main main.js file is like this

  render( <Router history={hashHistory}> <Route path="/" component={Loginpanel} > <Route path="Index" component={App}/> <Route path="Form" component={Form} /> </Route> </Router>, document.getElementById('js-main')); 

Thanks in advance.

Answer 1

In response, his link , not a link. Can you try it once?

 import {Link} from 'react-router'; 

Answer 2

In addition to the Harkirat Saluja answer:

display method example:

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

Answer 3

If you are using a reactive router version 4, then this is the correct way to import Link

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

since the React Router project is now split into several different libraries

Answer 4

Change link to link

The first letter is capitalized.