react中React.createRef()的使用
<p>react中React.createRef()的使用</p><div class="cnblogs_Highlighter">
<pre class="brush:html;gutter:true;"><!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Hello World</title>
<script type='text/javascript' src="./react.development.js"></script>
<script type='text/javascript' src="./react-dom.development.js"></script>
<script type='text/javascript' src="./babel.min.js"></script>
</head>
<body>
<div id="root"></div>
<script type="text/babel">
class Demo extends React.Component {
// React.createRef() 调用后返回一个容器,该容器可以存储被ref标识的节点
myRef = React.createRef()
showData = () =>{
console.log(this.myRef)
}
render(){
return (
<div>
<input ref={this.myRef} placeholder="点击按钮提示数据"></input>
<button onClick ={this.showData}>点我</button>
</div>
)
}
}
ReactDOM.render(<Demo />,document.getElementById('root'))
</script>
</body>
</html>
</pre>
</div>
<p> 运行效果</p>
<p><img src="https://img2020.cnblogs.com/blog/1770392/202102/1770392-20210203224603150-1271548436.png" alt="" loading="lazy"></p><br><br>
来源:https://www.cnblogs.com/malong1992/p/14370177.html
頁:
[1]