美文网首页优美编程
React的setState和数据绑定

React的setState和数据绑定

作者: 小遁哥 | 来源:发表于2019-02-15 11:40 被阅读3次

codepen地址
https://codepen.io/xiaodun/pen/MLPbym?editors=0010

this.setState({})

上述调用会触发render函数,

1.这意味着即使不在state上的数据,只要发生变化也可以更新模板。

 addOutList=()=>{
    list.push(1);
    this.setState({})
  }

上面的list是声明在类外部的,对应的模板代码为

    {
        list.map((el,index)=><div>外面list {index}</div>    )
    }

2.可以直接更改state上的数据,然后调用setState即可。

通过测试发现,即使setState方法里指明具体的属性,还是会同步更新已经变化了的,证明不会有性能问题。

addInnerList=()=>{
  this.state.list.push(1);
  this.setState({
    name:13
  })
}

改变list的引用依然会更新。

总结

至于会不会有其他问题,暂时没有发现,因为看到的写法都是指明具体要更新的属性。

相关文章

  • React的setState和数据绑定

    codepen地址https://codepen.io/xiaodun/pen/MLPbym?editors=00...

  • Vue和React数据绑定对比

    在数据绑定上来说,vue的特色是双向数据绑定,而在react中是单向数据绑定。 一 单向和双向数据绑定其实不是完全...

  • setState

    React文档对于setState的解释和应用setState()会对组件状态的改变进行排列然后噶欧式React该...

  • React setState解析

    setState setState是React中用于设置组件状态相关数据的,通常用于需要对state进行修改的时候...

  • 2018-11-20 React setState同步更新

    react的setState特点: react中的setState特点: 1. 异步操作函数; ...

  • setState是同步还是异步?

    1.在组件生命周期中或者react事件绑定中,setState是通过异步更新的。2.在延时的回调或者原生事件绑定的...

  • React 数据绑定 和 事件绑定

    根据实际代码,简单讲解一下数据绑定和事件绑定的用法请新建 js 文件 > 编写代码 ; 并在index.js引入并使用它

  • 数据操作dom的添加和删除

    一、react操作页面元素的途径 react使用数据绑定操作dom,如果绑定的数据多了,那么dom元素就多了;删除...

  • React基础组件的事件绑定

    在React中, 对于组件事件的绑定是有很大的坑的.比如经常会报如下这种错误: Warning: setState...

  • redux 简单描述

    react 是单项数据绑定

网友评论

    本文标题:React的setState和数据绑定

    本文链接:https://www.haomeiwen.com/subject/dcjpeqtx.html