ref属性的使用

ref属性的使用

1.在react,Vue中均可以使用ref属性来操作DOM

• 在Vue中的使用：

html
			<p ref='p'>我是测试段落2</p>
			<input type="text" ref="input"/>
			<button @click="foucs">click me  输入框获得焦点</button>
组件内方法
				methods:{
					foucs(){
						this.$refs.input.focus();//获取焦点
						this.$refs.p.style.color='red';
					}
				}

• 在react中的使用：

			class Test extends React.Component {
				constructor(){
					super();
					this.state={
						
					}
				}
				test(){
					this.refs.input.focus();
					
				}
				render(){
					return (
						<div>
							<input type='text' defaultValue='111' ref='input'/>
							<button onClick={()=>{this.test()}}>click </button>
						</div>
					)
				}
			}

就是一点点的区别。