前后端之路程序员

vue引用组件的几种方法总结

2018-06-23  本文已影响3人  吃盖浇饭

第一种,直接页面引入:

<dialog-smbox v-if="smBox" :smbox="smboxMessage"></dialog-smbox>
import引入:
import Smbox from "./Smbox.vue"
模板引入:
components: {
      "dialog-smbox": Smbox,
    },

第二种,放入路由里引入:

const Header = resolve => {
    require.ensure(['components/Header.vue'], () => {
        resolve(require('components/Header.vue'));
    }, 'Home');
};
export const accountRoute =

    {
        path: '/vue/account',
        components: {
            default: Account,
        },
        children: [
            {
                path: 'accountDetail/:goodsId/:goods_source_type/:gameType',
                name:'accountDetail',
                components: {
                    default: AccountDetail,
                    'account-header': Header //这里放入组件头部
                }

  }

第三种,放入main.js里全局引入组件:

import VueBus from 'vue-bus'
Vue.use(VueBus);
上一篇 下一篇

猜你喜欢

热点阅读