Vue.js 是一個流行的 JavaScript 框架，它提供了很多有用的功能以幫助開發人員構建交互式 Web 應用程序。在 Vue.js 中獲取節點的方法非常簡單，我們可以使用 $refs 屬性來訪問節點。$refs 對象是 Vue 實例的屬性之一，它包含一個指向所有擁有 ref 屬性的元素或子組件的引用的對象。

當我們在 Vue 模板中使用了 ref 屬性時，Vue 將在 $refs 對象上創建一個與 ref 名字相同的屬性。這個屬性將包含通過 ref 查找到的元素或組件的引用。這使得我們可以在需要訪問 DOM 元素或組件實例時，輕松地引用它們。

<template>
<div>
<button ref="submitButton">Submit</button>
</div>
</template>
<script>
export default {
mounted() {
this.$refs.submitButton.textContent = 'Clicked';
},
};
</script>

在上面的代碼片段中，我們使用 ref 屬性給按鈕添加了一個引用名稱 submitButton。通過在 mounted 鉤子中使用 this.$refs.submitButton，我們可以訪問到該元素并修改其文字內容。

除了訪問 DOM 元素外，我們還可以使用 $refs 屬性訪問子組件的實例。通過在組件中添加 ref 屬性，我們可以輕松地訪問到子組件的實例。這對于在父組件中訪問子組件中的數據或方法時非常有用。

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

在上面的代碼片段中，我們在父組件中訪問了子組件的實例。通過在父組件中使用 this.$refs.child，我們可以訪問到 child-component 組件的實例，從而在父組件中訪問子組件的數據或方法。