在Vue中，您可以使用$refs屬性來獲取DOM元素的子節點。$refs是Vue實例的一個特殊屬性，用于引用模板中的元素或組件。
以下是一個示例，演示如何使用$refs獲取DOM元素的子節點：
1. 在模板中，給要獲取子節點的DOM元素添加一個ref屬性：
<template><div>
<div ref="parentElement">
<p>子節點1</p>
<p>子節點2</p>
<p>子節點3</p>
</div>
<button @click="getChildNodes">獲取子節點</button>
</div>
</template>
在上面的示例中，我們給包含子節點的<div>元素添加了一個ref屬性，并設置為"parentElement"。這樣就創建了一個引用，我們可以通過它來訪問該元素及其子節點。
2. 在Vue組件的方法中，通過this.$refs來訪問ref屬性所引用的DOM元素，并操作其子節點：
<script>export default {
methods: {
getChildNodes() {
const parent = this.$refs.parentElement;
const childNodes = parent.childNodes;
// 遍歷子節點
childNodes.forEach((node) => {
console.log(node);
});
},
},
};
</script>
在上面的示例中，我們通過this.$refs.parentElement訪問ref屬性引用的DOM元素。然后，我們使用childNodes屬性來獲取該元素的所有子節點。您可以使用childNodes方法來遍歷、操作或獲取子節點的信息。
注意：如果您要獲取的是組件的子節點，則需要給組件添加ref屬性，并通過this.$refs來訪問。如果要獲取具體的子節點元素，可以使用Element API中的方法，如querySelector或getElementById等。
