本文共 982 字，大约阅读时间需要 3 分钟。

在Vue中，我们可以通过ref特性和vm.$refs来获取特定的DOM对象。这种方法在开发中非常实用，特别是在需要操作DOM节点时。

###-step 1- 在子组件的template部分，给需要获取的DOM节点添加ref特性。在goods.vue的template中，可以这样定义：

这样就定义了一个名为menuWrapper的引用。

###-step 2- 在goods.vue的script部分，定义一个方法来引用上述DOM节点。在methods中添加如下代码：

import BScroll from 'better-scroll';
export default {
  data() {
    return {
      goods: []
    };
  },
  created() {
    this.$http.get('/api/goods').then((res) => {
      res = res.body;
      if (res.errno === ERR_OK) {
        this.goods = res.data;
        this.$nextTick(() => {
          this._initScroll();
        });
      }
    });
  },
  methods: {
    _initScroll() {
      // 初始化滚动功能
      this.menuScroll = new BScroll(this.$refs.menuWrapper, {
        click: true
      });
    }
  }
};

在methods中，我们使用this.$refs.menuWrapper来获取之前定义的DOM节点，并创建滚动插件。

###注意事项

• 确保在使用this.$refs之前，DOM节点已经加载完成。在created生命周期钩子中使用$nextTick可以确保节点已经渲染完成。
• 对于复杂的DOM操作或滚动插件，确保在mounted生命周期钩子中初始化滚动功能，以保证组件完全渲染后再进行操作。

通过这种方式，我们可以在Vue应用中方便地获取和操作特定的DOM节点。