vue 复习篇. 注册全局组件,和 组件库
初篇 ==============================================================
1. 编写loading组件(components/Loading/index.vue)
<template>
<div>loading</div>
</template>
<script>
export default {
name: 'loading'
}
</script>
2.注册为全局组件 (components/Loading/index.js)
import loading from './index.vue'
const loadingOp= {
install: (Vue) => {
Vue.component('loading', loading)
}
}
export default loadingOp
3.定义组件库(components/index.js)
import Model from './Model'
import Loading from './Loading'
export default {
Model,
Loading
}
4.开启全局使用此组件 (main.js)
import componetList from './components'
const { Model, Loading } = componetList
Vue.use(Model).use(Loading)
5. 使用组件
<template>
<loading></loading>
</template>
中篇 ==============================================================
1. 使用组件
1.新建一个plugins文件夹
2.在文件夹中创建放置全局组件的文件components.js
3.在components.js文件中引入所有要注册的全局组件
4.在app.js根实例文件中,引入components.js
import eg from '../components/eg.vue'; export default (Vue)=>{ Vue.component("Eg",eg); }
vue 复习篇. 注册全局组件,和 组件库的更多相关文章
- Vue之组件及组件通信
组件之全局组件 //注意:需要在Vue实例化之前注册全局组件,使用Vue.component("组件名",{ template:`组件模板` }) Vue.component(&q ...
- VUE注册全局组件和局部组件
全局组件 第一步:在components文件夹下建立一个子文件Users.vue <template> <div class="users"> {{msg} ...
- vue 自动注册全局组件
vue 自动注册全局组件 vue 注册全局组件的方式 const plugins = { install(Vue) { const requireComponent = require.context ...
- vue 注册全局组件
注册全局组件有啥好处呢? 提高代码的复用性:哪里需要写哪里,贼方便,就写一个标签:减少代码量:可以再配合slot一起使用,咦~~,舒服 为了让整个项目的可读性,我创建一个文件统一存放全局组件 1.创建 ...
- vue 中注册全局组件
1 全局注册组件 建一个 js 文件, 注册全局组件, 并且暴露出去 然后再在 main.js 中引入 在页面就可以直接使用了 2 全局注册过滤器 建立文件, 包含所有过滤器方法 ...
- Vue基础二之全局API、实例属性和全局配置,以及组件进阶(mixins)的详细教程(案列实现,详细图解,附源码)
本篇文章主要是写Vue.directive().Vue.use()等常用全局API的使用,vm.$props.vm.$options.vm.$slots等实例属性的使用,以及Vue全局配置.组件的mi ...
- Webpack+vue2.0如何注册全局组件 (01)
Part 1, 问题: webpack + vue2.0框架中,如何在入口js中注册组件? 就是在一个月以前,匆匆闯入vuejs这个社群,基本了解了vuejs的一些基础特性和语法.笔者兴致勃勃地开始想 ...
- vue.js中的全局组件和局部组件
组件(Component)是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素, Vue.js 的编译器为它添加特殊功能. 组件的使用有三 ...
- vue基础篇---vue组件
vue模块第一篇,因为公司马上要用到这vue开发.早就想好好看看vue了.只有实际工作中用到才会进步最快.vue其他的简单指令就不多讲了,没啥意思,网上一大堆.看w3c就ok. 组件这个我个人感觉坑蛮 ...
随机推荐
- UNP学习第五章(二)
一.POSIX信号处理 信号:告知某进程发生了某个事件的通知(软中断),通常是异步的. 信号可以:由进程发给另一个进程,由内核发给某个进程. 设置信号处理办法,有三个选择: 1.写一个函数,在信号发生 ...
- GPIO软件模拟IIC时序
一.MPU6050中的IIC时序 1.1 START和STOP SDA和SCL在高电平时,SDA拉低表示START.SCL拉低,表示可以传输数据. SDA和SCL在低电平时,SDA拉高表示STOP. ...
- hdu 6092 Rikka with Subset (集合计数,01背包)
Problem Description As we know, Rikka is poor at math. Yuta is worrying about this situation, so he ...
- 微信小程序常用API组件开发
关于小程序 张小龙定义小程序: 1.不需要下载安装即可使用: 2.用完即走,不用关心是否安装太多应用: 3.应用无处不在,随时可用. 特点: 1.适合业务逻辑简单的应用: 2,.适合低频应用: 3.适 ...
- Service系统服务(六):rsync基本用法、rsync+SSH同步、配置rsync服务端、访问rsync共享资源、使用inotifywait工具、配置Web镜像同步、配置并验证Split分离解析
一.rsync基本用法 目标: 本例要求掌握远程同步的基本操作,使用rsync命令完成下列任务: 1> 将目录 /boot 同步到目录 /todir 下 2> 将目录 /boot 下的 ...
- Monkey学习
Monkey是一个工程,生成伟随机事件流(在一段时间内完全不重复的事件流),由种子生成.可以模拟用户,点击,触屏等.最好用来做压力测试.无法做功能测试. adb shell monkey -p -v ...
- 微服务架构 技能图谱skill-map
# 微服务架构 技能图谱 ## 理论基础### 概念#### 多微合适 - 非代码函数 - 非重写时间 - 适合团队最重要 - 独立业务属性 - 全功能团队 #### 进程隔离 - 服务运行在独立的进 ...
- (3)C++复合类型
存储数据时必须跟踪的三个属性:信息储存在何处,存储的值,存储的类型 一.数组 #include <iostream> using namespace std; int main() { / ...
- Java关于Math类的三个取整方法
0x01 在java的Math类中有三个关于浮点数取整数的方法,分别是ceil (向上取整) floor(向下取整) round(四舍五入) 三个方法 0x02 ceil 向上取整,取整后总是比原来的 ...
- for in 的实现
v\:* {behavior:url(#default#VML);} o\:* {behavior:url(#default#VML);} w\:* {behavior:url(#default#VM ...