react 中的 API

设置状态:setState

setState(object nextState[,function callback])

  • nextState 将要设置的新状态,将与当前 state 合并;
  • callback 可选参数,回调函数,该函数将在 setState 设置成功,且组件重新渲染后调用

setState 是 react 事件处理函数中和请求回调函数中触发 UI 更新的主要方法,setState()并不会直接修改 this.state 的值,而是创建一个即将处理的 state。setState()并不一定是同步的,为了性能会批量执行 state 和 DOM 渲染

替换状态:replaceState

replaceState(object nextState[,function callback])

  • nextState:将要设置的新状态,替换当前 state;
  • callback:可选参数,回调函数,该函数将在 setState 设置成功,且组件重新渲染后调用
设置属性:setProps

setProps(object nextProps[,function callback])

  • nextProps:将要设置的新属性,会与当前的 props 合并
  • callback:可选参数,回调函数,该函数将在 setProps 设置成功,且组件重新渲染后调用

props 相当于组件的数据流,它总是会从父组件向下传递到各个子组件,当与外部 JavaScript 应用集成时,我们可能需要向组件传递数据或通知 react.render() 组件需要重新渲染,可以使用 setProps()

替换属性:replaceProps

setProps(object nextProps[,function callback])

  • nextProps:将要设置的新属性,会替换当前的 props
  • callback:可选参数,回调函数,该函数将在 setProps 设置成功,且组件重新渲染后调用
强制更新:forceUpdate

forceUpdate([function callback])

  • callback:可选参数,回调函数,该函数将在组件 render() 方法调用后调用

forceUpdate() 会使组件调用自身的 render() 方法重新渲染组件,组件的子组件也会调用自己的 render(),但组件重新渲染时依然会读取 this.props 和 this.state,如果状态没有改变,那么 react 只会更新 DOM。

forceUpdate() 方法适用于 this.props 和 this.state 之外的组件重绘,通过该方法通知 React 需要调用 render()

获取DOM节点:findDOMNode

DOMElement findDOMNode()

  • 返回值:DOM 元素 DOMElement

如果组件已经挂载到 DOM ,该方法返回对应的本地浏览器 DOM 元素,当 render 返回 null 或 false 时,this.findDOMNode() 也会返回 null

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 作为一个合格的开发者,不要只满足于编写了可以运行的代码。而要了解代码背后的工作原理;不要只满足于自己的程序...
    六个周阅读 8,664评论 1 33
  • 起步 安装官方脚手架: npm install -g create-react-app 创建项目: create-...
    Twoold阅读 1,554评论 0 0
  • React 是一个用于构建用户界面的 JAVASCRIPT 库。React主要用于构建UI,很人多认为 React...
    阳明先生1208阅读 1,752评论 0 4
  • 生命周期流程图简单如下: 组件让你把用户界面分成独立的,可重复使用的部分,并且将每个部分分开考虑。React.Co...
    Simple_Learn阅读 1,183评论 0 0
  • It's a common pattern in React to wrap a component in an ...
    jplyue阅读 3,379评论 0 2

友情链接更多精彩内容