版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/xutongbao/article/details/83030865
对于 React 组件来说,refs 会指向一个组件类的实例,所以可以调用该类定义的任何方法。
如果需要访问该组件的真实 DOM,可以用 ReactDOM.findDOMNode 来找到 DOM 节点,但我们并
不推荐这样做。因为这在大部分情况下都打破了封装性,而且通常都能用更清晰的办法在 React
中构建代码。
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
class Comp extends Component {
inner() {
console.log('inner')
}
render() {
return (
<div>
<input type="input"/>
</div>
)
}
}
class App extends Component {
constructor () {
super()
}
componentDidMount () {
const myComp = this.refs.myComp;
myComp.inner(); //访问子组件的函数
const dom = ReactDOM.findDOMNode(myComp);
dom.childNodes[0].value = 'hello';
dom.childNodes[0].focus();
}
render() {
return (
<div>
<Comp ref="myComp" />
</div>
);
}
}
export default App;