Question

这是我数据对象的一小部分。基本上，它用于创建导航菜单。在导航菜单里面有一些按钮可以触发功能，我想我会在数据对象中创建函数，因为它是最清晰的方法。

但是，this不会返回vue对象。因此除了使vm成为全球范围的一部分之外，我不知道如何做到这一点。

有什么想法吗？

const data = {
  login: {
    title: "Log in",
    icon: "fa fa-sign-in",
    action: function () {
      console.log("Log in");
      // This is where I want to access the vm, e.g. like this:
      // this.$root.showLoginBox();
    }
  }
}

Answer 1

定义Vue实例将在该实例的范围之外使用的函数似乎是不好的做法。

但是，如果你真的需要保持data对象的位置，你可以将this绑定到Vue实例中的函数：

const data = {
  login: {
    action: function () {
      console.log(this)
    }
  }
}

new Vue({
  created() {
    data.login.action.bind(this)();
  }
})

Here's a working codepen.

Vue：从实例范围

1 个答案: