vue创建全局组件

2020-05-27  本文已影响0人  jerryst

前置工作:在src/components中新建quanju文件夹,再创建quanju.vue, index.js

quanju.vue
<template>
  <div>全局组件</div>
</template>
<script>
  export default {
    name: 'quanju',
    data () {
      return {}
    }
  }
</script>
<style>
</style>

index.js
import quanjuComponent from './quanju.vue'
const quanju = {
  install: function(Vue) {
    Vue.component('quanju', quanjuComponent)
  }
}
// 导出组件
export default quanju

main.js中配置
/**
 * 全局组件
 */
import quanju from './components/quanJu/'
Vue.use(quanju);

页面中使用
<template>
    <div>
      <quanju></quanju>
    </div>
</template>
上一篇下一篇

猜你喜欢

热点阅读