Saya seorang pembangun Angular dan baru menggunakan React, ini adalah komponen React yang mudah, tetapi ia tidak berfungsi.
import react, { Component } from 'react';
import { render } from 'react-dom';
class TechView extends Component {
constructor(props){
super(props);
this.state = {
name:'Gopinath'
}
}
render(){
return(
<span>hello Tech View</span>
);
}
}
export default TechView;
Ralat: Apabila menggunakan JSX, 'React' mestilah dalam skop react/react-in-jsx-scope
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Tambah tetapan berikut dalam
.eslintrc.js/.eslintrc.jsonuntuk mengabaikan ralat ini:rules: { // suppress errors for missing 'import React' in files "react/react-in-jsx-scope": "off", // allow jsx syntax in js files (for next.js project) "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }], //should add ".ts" if typescript project }Kenapa? Jika anda menggunakan
NEXT.js，则无需在文件顶部导入React, nextjs akan melakukannya untuk anda.Rujukan: https://gourav.io/blog/nextjs-cheatsheet（Lembaran cheat Next.js）
Barisan import hendaklah:
import React, { Component } from 'react';Perhatikan huruf besar R dalam React.