javascript - 无法在反应中呈现组件
问题描述
我试图渲染一个简单的组件,但似乎无法让它工作。
<Col md={{ span: 16, offset: 4 }} xs={{ span: 20, offset: 2 }}>
{props.language === "en" ? <englishReport /> : <danishReport />}
</Col>
这就是<englishReport/>
组件和<danishReport/>
外观
import React, { Component } from 'react';
class indexDanish extends Component {
render() {
return (
<div style={{ color: "#fff", textAlign: "left" }}>
<b>hej</b>
</div>
);
}
}
export default indexDanish;
我已经在父组件中导入了这两个组件
解决方案
自定义组件名称需要以大写字母开头,否则 Babel 会将其视为字符串。
englishReport
将anddanishReport
名称更改为EnglishReport
andDanishReport
它将起作用。
<Col md={{ span: 16, offset: 4 }} xs={{ span: 20, offset: 2 }}>
{props.language === "en" ? <EnglishReport /> : <DanishReport />}
</Col>
推荐阅读
- python - 使用 exec() 函数和从 csv 读取的代码时出现问题
- c - 一次创建枚举和数组条目的宏
- javascript - JavaScript中的正则表达式带有多个字符搜索,如concat
- c++ - 使用 long double 时输出的预期值错误
- jquery - 每次重新加载时,jQuery 计数值加一
- ajax - extjs ajax 商店运行缓慢
- assembly - 组装 x86-64 | 分段故障
- html - 如何制作这样的滑块
- reactjs - 打字稿:如何修复此错误->“元素不可分配给字符串”/单击“X”时没有任何反应
- powerbi - 在过滤器函数中使用 DAX 变量