ref的应用
2022-03-11 本文已影响0人
水晶草720
import React, { Component } from 'react'
export default class app extends Component {
a = 100
myref=React.createRef()
render() {
return (
<div>
{/* <input ref="mytext" />
<button onClick={() => { console.log("click1", this.refs.mytext.value); }}>add1 普通模式</button> */}
<input ref={this.myref} />
<button onClick={() => { console.log("click2", this.myref.current.value); }}>add2 严格模式</button>
<button onClick={ this.handleClick.bind(this) }>add3 严格模式</button>
/** <React.StrictMode></React.StrictMode>*/
</div>
)
}
handleClick = () => {
console.log('click2',this.myref.current.value)
}
}
/**
* 新的写法
* myRef= React.createRef()
*
* <div ref={this.myRef}>Hello</div>
*
* this.myRef.current
*/
import React from 'react';
import ReactDOM from 'react-dom';
import App from "./01-base/06-ref"
ReactDOM.render(
<React.StrictMode>
<App>
</App>
</React.StrictMode>
, document.getElementById("root"))