可以在任意DOM元素上使用ref
屬性,然后在Vue實例中通過this.$refs
訪問這個DOM元素?
?1.訪問子組件實例,可以調用方法或者獲取值
<template><div><input type="text" ref="myInput" /><button @click="focusInput">聚焦輸入框</button></div>
</template><script>
export default {methods: {focusInput() {this.$refs.myInput.focus(); // 讓輸入框獲得焦點}}
};
</script>
?2.訪問子組件實例,可以調用方法或者獲取值
template><ChildComponent ref="childRef" />
</template><script>
import ChildComponent from './ChildComponent.vue';export default {methods: {callChildMethod() {this.$refs.childRef.someMethod(); // 調用子組件的方法this.$refs.childRef.name; // 獲取子組件的數據}}
};
</script>