核心:1. 类组件必须要继承React.Component
2. 类组件中的render()方法,返回值是一个jsx
// class 组件 import "./App.css"; import React from "react"; // 创建类组件 class App extends React.Component { constructor(props) { //类组件中默认初始化 super(props); this.state = { // 在state中存放的是动态数据 //相对于vue data=》存放动态数据 num: 10, }; // 不在state中存放的是固定数据 this.msg = "你好同学"; // this指向当前实例 } // es7 写法 // 生命周期 组件加载完毕 可以做dom操作 componentDidMount() { console.log("组件加载完毕"); } // 定义方法 changNum = () => { this.setState((state) => { // setState 用于修改数据 return { num: state.num + 1, }; }); //相当于 useState }; // 必须有render()方法,且返回值是一个jsx render() { return <div> <div>App{this.state.num}</div> <h2>{this.msg}</h2> <button onClick={()=>this.changNum()}>修改数据</button> </div>; } } export default App;
标签:React,render,App,react,state,num,组件,写法,中类 From: https://www.cnblogs.com/chccee/p/17146408.html