Sorry for the inconvenience of asking for help with finding an issue in my code, but I'm facing challenges while learning React.
I am attempting to pass a variable named hashRoute
to a component in react. However, every time I try to access the prop using this.props.route
within the component render method, I receive a browser warning that says:
"Warning: Unknown prop
route
on tag. Remove this prop from the element."
This is my Component:
var App = React.createClass({
render: function(){
var Child;
switch(this.props.route)
{
case 'about':
Child = about;
break;
default:
Child = Home;
break;
}
return (
<div>
<Child/>
</div>
);
}
});
Here is the calling function:
function render(){
var hashRoute = window.location.hash.substr(1);
ReactDOM.render(<app route = {hashRoute} />, document.getElementById('app'));
}
window.addEventListener('hashChange', render);
I must be making a mistake somewhere, but I am unsure what it is. I have also attempted to use the spread syntax (replacing
<app route = {hashRoute} />
with <app {...hashRoute} />
), but then I receive another browser warning telling me that React.__spread is deprecated and should not be used.
If you have any ideas, they would be greatly appreciated.