Vue框架提供了一種用于從子組件訪問父組件或DOM元素的方法。這種方法稱為$ref。$ref是一個對象，包含了為Vue實例上所有ref注冊的 DOM 元素和組件實例。下面我們來詳細了解Vue $ref的使用方法。

首先，對于DOM元素的引用，可以通過$ref指令來獲取：

<template>
<div>
<input v-model="message">
<button @click="submit">Submit</button>
</div>
</template>
<script>
export default {
data() {
return {
message: ''
}
},
methods: {
submit() {
console.log(this.$refs.input.value);
// 輸出文本框的值
}
}
}
</script>

這里我們使用了一個文本框和一個按鈕，當按鈕被點擊時輸出文本框的值。通過使用$refs.input來獲取這個文本框的引用，進而獲取文本框的值。

對于組件的引用，可以在組件上使用ref屬性：

<template>
<div>
<child-component ref="childComp"></child-component>
</div>
</template>
<script>
import ChildComponent from './ChildComponent.vue'
export default {
components: {
ChildComponent
},
mounted() {
console.log(this.$refs.childComp);
// 輸出ChildComponent組件實例
}
}
</script>

這里我們定義了一個父組件，包含一個子組件ChildComponent。在子組件上添加ref屬性，可以在父組件中通過$refs來引用這個子組件實例。

總結：

• $refs可以在Vue實例上注冊所有ref注冊的DOM元素和組件實例
• 獲取DOM元素的引用需要在DOM元素上使用v-ref指令。獲取組件的引用需要在組件上添加ref屬性