vue.js - 在 'export default' 之外的组件内调用 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/

如果您要导出单个文件组件，那么试试这个:

例子.js

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

主要.js

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

引用:https://v2.vuejs.org/v2/guide/single-file-components.html