react : 在组件内部获取组件本身

最新推荐文章于 2024-04-24 10:17:45 发布

羊二哥

最新推荐文章于 2024-04-24 10:17:45 发布

阅读量2.2k

点赞数

分类专栏： react 文章标签： react 组件

本文链接：https://blog.csdn.net/weixin_43586120/article/details/88885097

版权

话不多说，上代码：

1、this.refs.**.clientHeight就可以获取到当前组件的高度

//this.refs.**.clientHeight获取到当前组件的高度

class Category extends Component{
    toggle=()=>{  
        if(this.refs.category.clientHeight>74){//获取当前组件的高度
            /* 具体操作 */
        }
    }
    render(){
        return (
            <div ref="category">
                <a onClick={()=>{this.toggle()}}>
                    展开<Icon type="up" />
                </a>
            </div>
       );
   }
}

export default Category;

注：UI组件中不能使用ref。

2、使用 ref 来获取组件的引用

//点击按钮获取输入框的焦点

class MyComponent extends React.Component {
  handleClick() {
    // 使用原生的 DOM API 获取焦点
    this.refs.myInput.focus();
  }
  render() {
    //  当组件插入到 DOM 后，ref 属性添加一个组件的引用于到 this.refs
    return (
      <div>