第一步 在main.js里面 引入需要注册的组件例如:

//引入组件

import header from  './components/header.vue'

import footer from './components/footer.vue'

// 注册全局组件

Vue.component('headerVue',header);

Vue.component('footerVue',footer);

第二步使用组件

在app.vue里面

<headerVue></headerVue>

<footerVue></footerVue> 或者以驼峰式写法调用

<header-vue></header-vue>

<footer-vue></footer-vue>

vue 全局组件的注册的更多相关文章

  1. Vue全局组件注册

    通过Vue.component(‘组件名’, {配置对象})注册全局组件 在main.js中注册全局组件 test import Vue from 'vue' import App from './A ...

  2. 详解vue全局组件与局部组件使用方法

    这篇文章主要为大家详细介绍了vue全局组件与局部组件的使用方法,具有一定的参考价值,对此有需要的朋友可以参考学习下.如有不足之处,欢迎批评指正. vue全局/局部注册,以及一些混淆的组件main.js ...

  3. 自定义vue全局组件use使用、vuex的使用

    自定义vue全局组件use使用(解释vue.use()的原理)我们在前面学习到是用别人的组件:Vue.use(VueRouter).Vue.use(Mint)等等.其实使用的这些都是全剧组件,这里我们 ...

  4. vue插件 使用use注册Vue全局组件和全局指令

    插件一般会注册到全局使用 官方编辑插件介绍:https://vuefe.cn/v2/guide/plugins.html 全局组件: .首先建一个自定义组件的文件夹,比如叫loading,里面有一个i ...

  5. vue全局组件-父子组件传值

    全局组件注册方式:Vue.component(组件名,{方法}) demo: 子组件:upload.vue <template> <div > <div class=&q ...

  6. vue -全局组件和局部组件

    1.全局组件:Vue.component('标签名', 构造器名) Vue.component('mycpn', cpnC) 注:这种注册组件的方式是全局组件,可以在多个Vue实例中使用. 2.局部组 ...

  7. Vue 全局组件

    全局注册的组件可以在其他组件内直接使用,它在整个Vue实例中都是全局有效的. 非单文件组件中使用 Vue.component('student-list', { template: ` <div ...

  8. vue 全局组件【原】

    1.目录 2.内容 -Loading.vue <template> <div class="loading"> loading... </div> ...

  9. 自定义vue全局组件use使用(解释vue.use()的原理)

    我们在前面学习到是用别人的组件:Vue.use(VueRouter).Vue.use(Mint)等等.其实使用的这些都是全剧组件,这里我们就来讲解一下怎么样定义一个全局组件,并解释vue.use()的 ...

随机推荐

  1. 【转】python字符串/元组/列表/字典互转

    #-*-coding:utf-8-*- #1.字典 dict = {'name': 'Zara', 'age': 7, 'class': 'First'} #字典转为字符串,返回:<type ' ...

  2. 计算属性computed 与methods

    你可能已经注意到我们可以通过调用表达式中的 method 来达到同样的效果: <p>Reversed message: "{{ reversedMessage() }}" ...

  3. wamp的手动安装

    Wamp的手动安装 (http://www.cnblogs.com/homezzm/archive/2012/08/01/2618062.html) 一.Apache2.4安装 1.修改\Apache ...

  4. hdu4604 Deque(最长上升子序列变形)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4604 题意:一个含有n个数栈,每次取出一个数,可以把这个数放在deque(双向队列)首部,放在尾部,或 ...

  5. Unity优化总览

    CPU GC 序列化与反序列化,如protobuff,json解析 String的频繁构造,拼接,如ToString()会生成字符串,Object.name会返回拷贝 闭包和匿名函数,在闭包中调用外部 ...

  6. poj 3130 How I Mathematician Wonder What You Are! 【半平面交】

    求多边形的核,直接把所有边求半平面交判断有无即可 #include<iostream> #include<cstdio> #include<algorithm> # ...

  7. spring源代码下载并导入eclipse技巧

    环境:mac 安装brew /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install ...

  8. python网络爬虫之四简单爬取豆瓣图书项目

    一.爬虫项目一: 豆瓣图书网站图书的爬取: import requests import re content = requests.get("https://book.douban.com ...

  9. java数组实现买彩票(平移覆盖思想)

    package com.wh.shuzu; /** * 买彩票 * @author 贾相如同学 * 平移覆盖思想 */ public class Lotery3 { public static voi ...

  10. Android最简单的实例 :环境搭建及HelloWorld

    Android开发之旅:环境搭建及HelloWorld 2010-04-12 00:45 by 吴秦, 883961 阅读, 140 评论, 收藏,  编辑 ——工欲善其事必先利其器 引言 本系列适合 ...