React没有在简单的React组件中定义(Universal)
我正在使用15.0.1并使用React来创build通用应用程序
我正在获取React未在以下组件中定义
import {Component} from "react"; export default class HeroSearchView extends Component{ render() { return ( <div className='row'> hello </div> ); } }
以下代码调用React组件
import React from "react"; import { connect } from 'react-redux' import Coupon from '../../common/components/Coupon' import { actions as miscActions } from '../../redux/modules/misc' import HeroSearchView from './components/HeroSearchView' const mapStateToProps = (state) => ({ misc:state.misc }) export class HomeView extends React.Component{ render() { return ( <div> <HeroSearchView /> <Coupon {...this.props} /> </div> ); } } export default connect(mapStateToProps, Object.assign({}, miscActions))(HomeView)
我现在有点抓我的头,下面的消息意味着什么…
ReferenceError: React is not defined at HeroSearchView.render (HeroSearchView.jsx:8:13) at [object Object].ReactCompositeComponentMixin._renderValidatedComponentWithoutOwnerOrContext (/Users/roy/development/org/pl-core/node_modules/react/lib/ReactCompositeComponent.js:679:34) at [object Object].ReactCompositeComponentMixin._renderValidatedComponent (/Users/roy/development/org/pl-core/node_modules/react/lib/ReactCompositeComponent.js:699:32) at [object Object].wrapper [as _renderValidatedComponent] (/Users/roy/development/org/pl-core/node_modules/react/lib/ReactPerf.js:66:21) at [object Object].ReactCompositeComponentMixin.performInitialMount (/Users/roy/development/org/pl-core/node_modules/react/lib/ReactCompositeComponent.js:284:30) at [object Object].ReactCompositeComponentMixin.mountComponent (/Users/roy/development/org/pl-core/node_modules/react/lib/ReactCompositeComponent.js:237:21) at [object Object].wrapper [as mountComponent] (/Users/roy/development/org/pl-core/node_modules/react/lib/ReactPerf.js:66:21) at Object.ReactReconciler.mountComponent (/Users/roy/development/org/pl-core/node_modules/react/lib/ReactReconciler.js:39:35) at ReactDOMComponent.ReactMultiChild.Mixin.mountChildren (/Users/roy/development/org/pl-core/node_modules/react/lib/ReactMultiChild.js:203:44) at ReactDOMComponent.Mixin._createContentMarkup (/Users/roy/development/org/pl-core/node_modules/react/lib/ReactDOMComponent.js:589:32)
[注意] :如果我从我的示例代码中删除<HomeSearchView />
,它工作正常…
任何提示将不胜感激…
你需要使用
import React from "react"
和
export default class HeroSearchView extends React.Component
这是因为JSX会将您的文件转换为调用React.createElement
实际JS,并且由于您仅从反应中导入了Component
,因此无法find对React
引用
import React from "react"; export default class HeroSearchView extends React.Component{ render() { return ( <div className='row'> hello </div> ); } }
改变这个,它会工作。
你可以做这样的事情来保持你的代码整洁。
import React, {Component} from "react"; export default class HeroSearchView extends Component { render() { return ( <div className='row'> hello </div> ); } }