vue.js - 怎么把vue组件export default（{ }）中的代码写到另外的js文件中。

问题描述

问 题

一般写vue-cli创建项目的时候，组件是*.vue，这个组件里面的js部分都写在如下格式内：

export default {
  data() {},
  methods: {}
}

因为有时候页面的需求很大的时候，就要在*.vue的文件中既要写很多的html代码，还在在export default{}中写很多的代码，页面就很长，也很乱了，我想问的是可不可以把export default{}中的js代码分离到一个.js文件中，再通过import引入来使用的呢？我试过，好像不行，兄弟们，求教呀！

解决方案

sample.js文件

export default {
  data() {},
  methods: {}
}

sample.vue 文件

import sample from './sample'

<script>
    export default {
        ...sample
    }
</script>

我用vue做第一个项目的时候，只抽离公共组件，一个页面一个vue，也很长，现在页面都组件化了，分组件后不会那么长的

这篇关于vue.js - 怎么把vue组件export default（{ }）中的代码写到另外的js文件中。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！