1、ref的定义
React中的ref属性可以帮助我们获取子组件的实例或者Dom对象,进而对组件进行修改
场景,点击A调用B的方法:(单文件中使用ref)
1、引入useRef并定义ref对象
import React,{useState,useRef } from 'react';
function AvatarPopup(props) {
let fileInputEl = useRef();
}
2、绑定ref对象
<div className="upload-border-btn">
<input type="file" ref={fileInputEl} title="上传图片" accept="image/*" onChange={onChange} />
<div className="cursor upload-btn" onClick={onupload}>
上传图片
</div>
</div>
3、调用
点击上传图片按纽时,调用ref对象的方法
const onupload = () => {
fileInputEl.current.click()
}
网友评论