（四）对 state 的理解
# 🥥一、什么是简单组件，什么是复杂组件
- 如果组件是有状态的
state就是复杂组件 - 反之，组件没有
state就是简单组件
# 🦞二、组件实例的三大核心属性之一 state
- 说到组件实例，就必须是
class类定义的组件，才能使用
- state
- props
- refs
# 🥡二、初始化 state
# （一）、按照需求初始化一个组件
- 需求：点击文字在开心和伤心两个状态之间切换
// 1. 创建一个类组件
class Mood extends React.Component {
render() {
return <h1>今天心情很开心</h1>
}
}
// 2. 渲染组件到页面
ReactDom.render(<Mood/>, document.getElmentById('test'))# （二）、通过一个 boolea 在两个状态之间来回切换
// 1. 创建一个类组件
class Mood extends React.Component {
constructor(props) {
super(props)
this.state = {
isMood: true
}
}
render() {
return <h1>今天心情很{this.state.isMood ? '开心' : '伤心'}</h1>
}
}
// 2. 渲染组件到页面
ReactDom.render(<Mood/>, document.getElmentById('test'))
本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。
原始发表：2022年12月31日，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录
腾讯云开发者
