Vue Vue.use() / Vue.component / router-view
Vue.use
- Vue.use 的作用是安装插件
- Vue.use 接收一个参数
- 如果这个参数是函数的话,Vue.use 直接调用这个函数注册组件
- 如果这个参数是对象的话,Vue.use 将调用 install 方法来注册组件
* 官方文档:
* Vue.use 用于安装 Vue.js 插件。
* 如果插件是一个对象,必须提供 install 方法
* 如果插件是一个函数,它会被作为 install 方法
* install 方法调用时,会将 Vue 作为参数传入
Vue.component
- Vue.component 的作用是注册组件
- Vue.component('component-name',{})
- Vue.component('component-name',the_import_component_object)
demo
// 注册组件
import LeftRight from './src/left-right'
LeftRight.install = function (Vue) {
Vue.component(LeftRight.name, LeftRight)
}
export default LeftRight
// main.js: 安装组件
import LeftRight from '../components/left-right'
Vue.use(LeftRight)
router-view
- 是组件的占位符
- 当 path匹配到一个组件的时候,会把这个组件加载进来
- 并且最终会替换掉
Vue 中 router的 mode="hash" 是以 # 开始
Vue Vue.use() / Vue.component / router-view的更多相关文章
- Vue 2.0 + Vue Router + Vuex
用 Vue.js 2.x 与相配套的 Vue Router.Vuex 搭建了一个最基本的后台管理系统的骨架. 当然先要安装 node.js(包括了 npm).vue-cli 项目结构如图所示: ass ...
- vue组件大集合 component
vue组件分为全局组件.局部组件和父子组件,其中局部组件只能在el定义的范围内使用, 全局组件可以在随意地方使用,父子组件之间的传值问题等. Vue.extend 创建一个组件构造器 template ...
- vue教程3-05 vue组件数据传递、父子组件数据获取,slot,router路由
vue教程3-05 vue组件数据传递 一.vue默认情况下,子组件也没法访问父组件数据 <!DOCTYPE html> <html lang="en"> ...
- Vue学习笔记-Vue.js-2.X 学习(七)===>脚手架Vue-CLI(路由Router)
脚手架Vue-CLI(路由Router) 一 按装(通过新创建脚手架按装),如果在原来的脚手架上按装直接进图型化界面vue ui的插件按装. 二 使用(上面按装下面步骤自动会生成) 第一步:导入路由对 ...
- Vue回炉重造之router路由(更新中)
安装vue-router npm i vue-router -S 配置1.创建文件夹与文件 创建一个router文件夹,在文件夹中创建两个文件,分别是router.js和routes.js文件.2.编 ...
- 前端框架vue.js系列(9):Vue.extend、Vue.component与new Vue
前端框架vue.js系列(9):Vue.extend.Vue.component与new Vue 本文链接:https://blog.csdn.net/zeping891103/article/det ...
- Vue.js起手式+Vue小作品实战
本文是小羊根据Vue.js文档进行解读的第一篇文章,主要内容涵盖Vue.js的基础部分的知识的,文章顺序基本按照官方文档的顺序,每个知识点现附上代码,然后根据代码给予个人的一些理解,最后还放上在线编辑 ...
- Vue学习笔记-Vue基础入门
此篇文章是本人在学习Vue是做的部分笔记的一个整理,内容不是很全面,希望能对阅读文章的同学有点帮助. 什么是Vue? Vue.js (读音 /vjuː/,类似于 view) 是一套构建用户界面的渐进式 ...
- 【实战】Vue全家桶(vue + axios + vue-router + vuex)搭建移动端H5项目
使用Vue全家桶开发移动端页面. 本博文默认已安装node.js. github链接 一.准备工作 安装vue npm install vue 安装脚手架vue-cli npm install -g ...
- 【vue开发】vue导出Excel表格教程&demo
前端工作量最多的就是需求,需求就是一直在变,比如当前端数据写完之后,需要用Excel把数据下载出来:再比如前端在没有数据库想写些demo玩时,也是很好的选择. 第一步安装依赖包,修改配置 1.装依赖: ...
随机推荐
- bootstrap样式:.clearfix
我们知道,在静态页面的编写中,清除浮动是一件很繁琐的事情. 所以一般的CSS框架都会有用来清除浮动的样式. 在bootstrap中,这个样式叫 clearfix. 只要在需要清除浮动的元素的父元素加上 ...
- javascript : splice(0) 的妙用
今天看前同事的代码,有个写法很有意思: splice(0). 有意思的是,这并不是一个“合法”的写法. w3school是这样写的: arrayObject.splice(index,howmany, ...
- Docker 概念-1
阅读本文大概需要15分钟,通过阅读本文你将知道一下概念: 容器 什么是Docker? Docker思想.特点 Docker容器主要解决什么问题 容器 VS 虚拟机 Docker基本概念: 镜像(Ima ...
- android 文件读写权限的设定
读取本地文件的权限问题 2016年08月15日 21:41:30 阅读数:2520 在一个音乐app过程中需要读取手机本地内存卡中的音乐文件并可以播放,具体遇到的问题如下:工程没有错误,运行出现以下信 ...
- ngx lua获取时间戳的几种方式
原创自由de单车 最后发布于2017-02-14 14:58:43 阅读数 18218 收藏 在ngx_lua里,获取时间相关信息的方式大概有4种(见下面代码): print(string.forma ...
- 第二部分_Mac技巧
原文是"池建强"的微信文章,公众号为"MacTalk" 第五十一天 mdfind是一个非常灵活的全局搜索命令,类似Spotlight的命令行模式,可以在任何目录 ...
- Python核心编程(第3版)PDF高清晰完整中文版|网盘链接附提取码下载|
一.书籍简介<Python核心编程(第3版)>是经典畅销图书<Python核心编程(第二版)>的全新升级版本.<Python核心编程(第3版)>总共分为3部分.第1 ...
- 安装fiddler 谷歌插件
移动 .crx 插件无法安装问题 解决方案: 修改后缀名为 .zip 文件 进行解压后,使用浏览器扩展程序加载已解压的文件进行扩展 添加插件 2020-06-20
- 重置spyder 解决 gbk 编码不能读取问题
重置spyder 解决 gbk 编码不能读取问题 2020-06-18
- 实现了__iter__和__next__的对象是迭代器
class MyList(object): """自定义的一个可迭代对象""" def __init__(self): self.items ...