• react中findDOMNode


    在使用react过程中,大家有时会
    那么这里的findDomNode是做什么的呢?

    import { findDomNode } from 'react-dom';

      简单来说是用来得到实际Dom的,因为react组件有个特点,它有自定义组件,比如<NavBox/>这种,用ref来获取这种组件获取到的这是组件定义的对象的实例,见下面代码

    getNodeInstance() {

        const nodeInstance = this.refs.navBox;

    }   





    function WapShop() {

        return (

            <div>

                  <NavBox ref="navBox" />

            </div>

        );

    }

      这里的nodeInstance就是一个NavBox的实例,但是如果这样:  此时initailNode会得到NavBox组件中render方法返回的dom元素。

    let initialNode  =  findDomNode(this.refs.navBox);
    reactJs对DOM的操作
    1. 使用选择器

    var Btn = document.getElementById('btn')
    ReactDom.findDOMNode(Btn).style.color = 'red'
    2. 使用ref

    在标签内使用ref='btn'

    this.refs.btn.style.color = 'red'
    Refs 是访问到组件内部DOM节点唯一可靠的方法 
    注意:不要在render或render之前对Refs进行调用

  • 相关阅读:
    单行居中,2行居左,超过2行省略
    Angular2环境搭建
    数字保留2位小数
    结束循环函数
    获取元素的定位值
    $.extend
    node使用指南
    Telsa显卡比较
    Jupyter-notebook 不自动打开浏览器解决办法
    teamviewer连接未就绪的解决(Manjaro Linux)
  • 原文地址:https://www.cnblogs.com/jcxfighting/p/10414643.html
Copyright © 2020-2023  润新知