ref在vue项目中常见的3种用法

ref的使用:

1.简单操作dom元素
<div id="box" ref="refdiv"> haha</div>
mounted(){
this.$refs.refdiv.style.color = 'red' //修改box的字体颜色
}
2.调用子组件中data的数据
子组件中： data(){name:"王一博"}

父组件中：<son ref="myref"></son>

mounted:{ this.$refs.myref.name}//获取子组件中的数据name

3.调用子组件中的方法

子组件中：method:{  login(){ uni.navagateTo({url:"/login"}}

父组件中：<son ref="myref"></son>

mounted:{ this.$refs.myref.login()}//获取子组件中的login方法