如何将 props 传递给反应组件?
2017-03-23
709
对于“请在我的代码中找出错误”的问题,我深表歉意,但是我在尝试掌握 React 时遇到了困难。
我试图将一个名为
hashRoute
的变量传递给 react 中的组件,但是每当我尝试在组件渲染方法中使用
this.props.route
访问 prop 时,我都会收到浏览器警告:
"Warning: Unknown prop
route
on tag. Remove this prop from the element.
我的组件:
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>
);
}
});
调用函数:
function render(){
var hashRoute = window.location.hash.substr(1);
ReactDOM.render(<app route = {hashRoute} />, document.getElementById('app'));
}
window.addEventListener('hashChange', render);
我显然做错了什么,但我不完全确定是什么。我也尝试过使用扩展语法(将
<app route = {hashRoute} />
替换为
<app {...hashRoute} />
,但随后我收到另一个浏览器警告,告诉我
React.__spread 已被弃用,不应使用。
任何想法都将不胜感激。
1个回答
关于 React 组件的一个鲜为人知的事实:组件的名称必须以大写字母开头。这是为了与 React 中为 HTML 保留的组件(如 div、span 等)区分开来。
Rob Brander
2017-03-23