index.vue 文件的代码
<template>
<div>
<h1>{{title}}</h1>
<p>{{message}}</p>
</div>
</template>
index.js文件
import Vue from 'vue'
import indexComp from './index.vue'
export default Vue.extend({
mixins: [indexComp],
data(){
return{
title:'大标题',
message:'我是分开的js文件'
}
},
created(){
this.hello();
},
methods: {
hello: function () {
console.log('hello from mixin!')
}
}
});
在使用组件的时候直接引入index.js即可
<template>
<div>
<testComp></testComp>
</div>
</template>
<script>
import testComp from './components/test/index.js'
export default {
components:{
testComp,
},
}
</script>