淡淡烟草味2017-05-19 10:20:26
比如我拿ueditor来做了一个Editor的组件
然后在另一个页面有个表单,里面把Editor引入进来了。当然,components里面注册时必须的!
我在页面上点击提交,那么,就会用到编辑器的getContent()方法,那么问题来了,getContent这个方法所在的对象如何界定?或者一个页面上有几个组件,都有getContent这个方法,那怎么办?
这里就给editor了一个ref属性,我理解成其实就是类似html里面的id。
然后,组件或者实例中使用$refs,就是找出所有具有ref属性的组件!然后放在一个对象中。
对象的键就是ref的属性值。
<template>
<p>
<Editor ref="details"></Editor>
<Table ref="mainTable"></Table>
<Form ></Form>
</p>
</template>
<script>
export default (){
data(){
return {}
},
components:{Editor,Table,Form},
methods:{
getContent(){
console.log(this.$refs);//这里打印的就是一系列的带有ref属性的组件构成的对象
this.$refs.details.getContent();//这里就可以使用editor的getContent方法了
}
}
}
</script>