在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等。
