在“导出默认值”之外的组件内调用VueJS方法

Question

我试图从外部在“方法”内部调用函数。但是，它不起作用。

Github问题报告相同：https : //github.com/vuejs/vue/issues/329

vm.test(); // call a function in method, not working
this.vue.test()  // not working
export default {
  methods: {
    test: function() {
      alert('test fuction called');
    }
  }
}

Answer 1

尚不清楚原始发布者的实际目标是什么，但是这是在创建Vue实例后可以在其上调用方法的方式：

var viewModel = new Vue({
    el: "#app",
  data: {
    msg: "Hello there"
  },
  methods: {
    test: function() {
      alert('test fuction called');
    }
  }
});

viewModel.test();

工作示例：https : //jsfiddle.net/Daryn/Lja7pake/3/

如果要导出单个文件组件，请尝试以下操作：

example.js

<script>
   export default {
    methods: {
      test: function() {
      alert('test fuction called');
     }
    }
   }
</script>

main.js

<script>
    import Thing from './example.js';
    Thing.test();
</script>

参考：https：//vuejs.org/v2/guide/single-file-components.html

Answer 2

你试图实现的目标从根本上来说是有缺陷的。除非您拥有对该特定组件实例的引用，否则您无法调用该组件的方法。在您的代码中，指的是哪个特定组件？vm

您所做的就是从模块中导出 Vue 组件定义；这里没有实例化组件。

我们需要查看您的更多代码或对您想要实现的目标的完整解释，以便我们可以提供替代解决方案。（为什么要尝试在其定义之外调用组件的方法？）