为什么高阶组件在反应中不起作用?
why high order component is not working in react?
你能告诉我为什么这个高阶组件不起作用吗?我正在尝试使用 HOC
显示按钮和标签。这是我的代码
http://codepen.io/anon/pen/ygpVeZ
var D = (comp) => class extends React.Component{
render (){
return (<comp/>)
}
}
class A extends React.Component {
render(){
return (
<button>hrllo</button>
)
}
}
class B extends React.Component {
render(){
return (
<label> hello</label>
)
}
}
const PP =D(B)
const PPP =D(A)
class C extends React.Component {
render(){
return (
<div>
<PP></PP>
<PPP></PPP>
</div>
)
}
}
ReactDOM.render(<C/>,document.getElementById('root'))
React 组件必须以大写字母开头,您可以在 docs.
中阅读
Capitalized types indicate that the JSX tag is referring to a React
component. These tags get compiled into a direct reference to the
named variable, so if you use the JSX expression, Foo must be
in scope.
var D = (comp) => class extends React.Component{
render (){
return (<comp/>)
}
}
应该是
var D = (Comp) => class extends React.Component{
render (){
return (<Comp/>)
}
}
你能告诉我为什么这个高阶组件不起作用吗?我正在尝试使用 HOC
显示按钮和标签。这是我的代码
http://codepen.io/anon/pen/ygpVeZ
var D = (comp) => class extends React.Component{
render (){
return (<comp/>)
}
}
class A extends React.Component {
render(){
return (
<button>hrllo</button>
)
}
}
class B extends React.Component {
render(){
return (
<label> hello</label>
)
}
}
const PP =D(B)
const PPP =D(A)
class C extends React.Component {
render(){
return (
<div>
<PP></PP>
<PPP></PPP>
</div>
)
}
}
ReactDOM.render(<C/>,document.getElementById('root'))
React 组件必须以大写字母开头,您可以在 docs.
中阅读Capitalized types indicate that the JSX tag is referring to a React component. These tags get compiled into a direct reference to the named variable, so if you use the JSX expression, Foo must be in scope.
var D = (comp) => class extends React.Component{
render (){
return (<comp/>)
}
}
应该是
var D = (Comp) => class extends React.Component{
render (){
return (<Comp/>)
}
}