怎么把vue组件export default({ })中的代码写到另外的js文件中。

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

export default {
data() {},
methods: {}
}
怎么把export default{}中的js代码分离到一个.js文件中,再通过import引入来使用的呢?我试过,好像不行,求教!

你咋不按规矩出牌,写成单文件组件多好,是提倡的做法,分开写维护起来多麻烦

试试mixins,应该能满足你的需求混入

1 Like

当然可以啊,你可以这样:

<script>
  import something from './real-script.js'
  export default something
</script>

还可以这样:

<script>
  export {default as default} from './real-script.js'
</script>

或者这样:

<script src="./real-script.js"></script>

不过你这么做的目的是什么……= =

3 Likes

膜拜大神,估计是为了将结构、样式、逻辑脚本,都单独分离出来

分得那么细,为了方便代码管理就得建立一堆子目录,这和写一个 vue 文件不是一个效果嘛

:smiley: vue新手,上周我也有过与楼主相同的想法,很想把js给独立出来,我是感觉把html和js都写一起,在来回编辑和翻看的时候会很麻烦。。。后来加个显示器解决了我的问题。

2 Likes

编辑器的书签功能、分栏功能可破

PS: 你的 ID 很强

请问js文件的格式可以说一下吗?我独立到js文件之后,编译就报错了编译器认不出import 和 export default