外部反应组件没有在App.js中呈现
外部反应组件没有在App.js中呈现
提问于 2019-06-16 19:40:31
我对react.js非常陌生。当我从事一个实践项目时，我遇到了这个奇怪的错误。导入时，外部js文件中的一些组件呈现，而有些则不呈现。
app.js：
import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import Hello from './components/hello'
import functionalClick from './components/fuctionalClick'
class App extends Component {
render() {
return (
<div className="App">
<Hello name='Lol '></Hello>
<functionalClick></functionalClick>
</div>
);
}
}
export default App;functionalClick.js：
import React from 'react'
function fuctionalClick() {
return (
<div>
<button>Click</button>
</div>
)
}
export default fuctionalClickhello.js：
import React from 'react';
const Hello = (props) => {
return (
<div>
<h1>
Hello {props.name}!
</h1>
</div>
);
}
export default Hello;functionalClick.js不呈现，但第一个方法呈现(hello.js)。即使我遵循的语法几乎相同.在这里输入图像描述。
回答 3
Stack Overflow用户
回答已采纳
发布于 2019-06-16 19:43:01
我认为在函数fuctionalClick的声明中可能有一个错误。看上去你在c之后错过了一个c。您的组件可以作为undefined导入。查看您的浏览器控制台以获得其他信息。
试着改变这个：
import functionalClick from './components/fuctionalClick'这是：
<functionalClick></functionalClick>对此：
import fuctionalClick from './components/fuctionalClick'这是：
<fuctionalClick></fuctionalClick>看看这是否有帮助。
Stack Overflow用户
发布于 2019-06-16 19:58:43
根据docs 用户定义的组件必须大写。
当您尝试使用小写的非HTML标记时，React还显示了一些警告。
警告:正在使用大写HTML。始终在React中使用小写HTML标记。
警告:该标签在此浏览器中无法识别。如果您打算呈现一个React组件，请用大写字母开头它的名称。
Stack Overflow用户
发布于 2020-11-20 10:02:22
在您的问题中，错误，但有时也不工作，然后检查您的组件名称后，首先。如果它很小，那就做它的资本。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56622078
复制相关文章
相似问题
腾讯云开发者
