所以我一直在处理我正在处理的这段代码

依赖关系:React,Redux,Eslinter,PropTypes,BreadCrumb

有一个视图页面,可从其他文件导入各种组件

现有结构如下:

import Component from './Component.js';

...

let var = '';

...

if (this.state.value !=== null) {
  var = <Component/>
}

...

render() {
  return(
    <div>
        SomeContent
        {var}
   </ div>
  )
}


当我尝试导入创建的PureComponent时,代码将编译。

组件依赖关系:{Button,Modal} React-Bootstrap,React,PropTypes

但是该页面无法呈现,因此我无法弄清楚以与上述现有结构相同的方式引入该页面时无法呈现的原因。

更新:我尝试制作最少的组件,只返回一个简单的Div并得到相同的结果

解决:
我的组件中有一个从'react-bootstrap'到Modal的折旧参考,该参考仍然包含node_module参考标题,但没有相应的JS文件,此后它们已移至'react-modal'

最佳答案

import Component from './Component.js';

let entity = '';


if (this.state.value !== null) {
    entity = <Component />
}


render() {
    return (
        <div>
            SomeContent
        {entity}
        </ div>
    )
}


首先,您不能使用var关键字来命名变量,而且,请检查您的条件是否满足。

关于javascript - 导入新的React组件会编译但不会渲染,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/59411155/

10-12 12:48
查看更多