首页 >

react中怎么修改组件状态

web前端|前端问答react中怎么修改组件状态
React
web前端-前端问答
如何修改网上下载的flash源码,vscode怎么加注释,github在ubuntu,tomcat实验报告,爬虫做财务,php 上传目录权限,宜春抖音seo推广公司,网站获取访问者qq号码,建一个网站模板网lzw
react中怎么修改组件状态
java仿微盟源码合买,vscode如何设置,ubuntu安装 花屏,tomcat dos窗口,sqlite 美团,服务器独享带宽,网站在线留言插件,微信前端商城框架,必应词典爬虫,php设计培训机构,深圳网站seo外包公司,视频短片分享网站,个人简介网页源码,jq特效网站模板,注册成功跳转页面模板,广告管理系统代码,程序查询lzw
在 React 中不能直接修改组件的状态,需要通过 setState() 来进行修改
简易网站导航源码,自己组装Ubuntu电脑,tomcat9 更改端口,排酸爬虫,怎么把php变成黑色,网站seo很 棒乐云seolzw
在react中,setstate是用于更新组件状态state的方法;setState()将对组件state的更改排入队列,并通知React需要使用更新后的state重新渲染此组件及其子组件,语法为“setState(对象,[回调函数])”。

语法:

setState(updater[, callback])

updater 更新器

callback 更新后执行的回调函数

修改状态

比如想要将 state 中的 content 值修改为 ‘香香’

state = {  content: '大熊'}

通过直接修改的方式并不能触发视图的更新:

this.state.content = '香香'

需要通过 setState 来进行修改:

this.setState({  content: '香香'})

获取最新的状态值

因为 setState() 是异步的,所以在修改状态后不一定能获取到最新的值,如果想要获取最新的状态值可以为 setState() 提供一个回调函数,在状态更新后会去执行这个回调,可以在回调函数中获取最新的状态

示例:

this.setState({  content: '香香'}, () => {  // 通回调获取最新的状态  console.log(this.state.content)})

setState() 的第一个参数也可以是函数,这个函数接收两个参数:第一个参数为更新前的状态值,第二个参数为 props(可获取父级组件传递的数据);当修改状态时涉及到前一个状态值时就可以使用这种形式。

this.setState((state, props) => {  console.log(state.content, props)  // 返回一个对象  return {    content: prev.content + '香香'  }})

《react视频教学》


  • 暂无相关文章
  • Posted in 未分类