Question

是否可以在单独的.js文件中编写方法，数据，计算等，然后将其导入component.vue文件中？

我不会将所有js逻辑都放在一个.vue组件中。

对于每个组件，我都希望以这种方式组织代码：

myComponent/
      component.vue
      methods.js
      data.js
      computed.js
      etc..

然后进入component.vue：

methods: ()=> from './methods.js'

我刚刚尝试了模块导出，但是没有用

Answer 1

只需导出对象和函数，然后将它们导入组件中即可。

packageA

@types/packageC-v1

DefinetelyTyped/types

// methods.js
export default {
  myMethod () {
    console.log('a');
  }
}

Answer 2

我建议改用mixins。

Mixins提供了一种处理外部代码的强大方法，这意味着您不必在不同文件（例如data.js，methods.js等）之间隔离逻辑

相反，您可以将与一个特定功能相关的所有逻辑保存在一个文件（混合）中，然后将其注入到您的组件中，或者如果您发现代码可重用，则将其注入到多个组件中。

此外，需要特别注意的是，mixins保留了标准的Vue js生命周期方法功能。

myMixin.js

export default {
  data() {
    return {
      myData: ''
    }
  },
  methods: { ... },
  created() { ... },
  mounted() { ... },
  etc...
}