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.装依赖: ...
随机推荐
- GPO - Windows Server Update Services
Windows Server Update Services Configuration Wizard: Approve procedure of these updates is very tiri ...
- Ethical Hacking - GAINING ACCESS(7)
Server Side Attacks - NEXPOSE NeXpose is a vulnerability management framework, it allows us to disco ...
- vue : 自定义脚手架提示
做项目做烦了就想找点乐子. 比如,我们可以自定义脚手架提示. webpack.dev.conf.js 54-78 行 module.exports = new Promise((resolve, ...
- Pytorch实现基于卷积神经网络的面部表情识别(详细步骤)
文章目录 一.项目背景 二.数据处理 1.标签与特征分离 2.数据可视化 3.训练集和测试集 三.模型搭建 四.模型训练 五.完整代码 一.项目背景数据集cnn_train.csv包含人类面部表情的图 ...
- 一起学Blazor WebAssembly 开发(3)
接着上篇,本篇开始讲下实现登录窗口,先看下大概的效果图: 打开的效果,没有美工美化 点登录校验得到不能为空 我在做blazor时用到了一个ui框架,这个框架名叫Ant Design blazor(ht ...
- Git报错问题集锦
git merge合并时遇上refusing to merge unrelated histories的解决方案 如果git merge合并的时候出现refusing to merge unrelat ...
- 手把手教你基于C#开发WinCC语音报警插件「附源代码」
写在前面 众所周知,WinCC本身是可以利用C脚本或者VBS脚本来做语音报警,但是这种方式的本质是调用已存在的音频文件,想要实现实时播报报警信息是不行的,灵活性还不够,本文主要介绍基于C#/.NET开 ...
- vue学习(十七) 使用自定义指令 使文本框获得鼠标焦点
需求:当我们进入某个页面,页面中的第一个input会自动获得焦点 光标闪烁,代表可输入 <div id="app"> //v-focus 是自定义的 <input ...
- 修改alpine Linux的Docker容器的时区
适用对象 使用 Alpine Linux 发行版的 Docker 镜像容器. 仅仅适用于没有安装uclibc的系统. 修改步骤 进入容器命令行 # docker exec -it container_ ...
- windows 下安装YApi及集成Idea的YapiUpload
一准备工具 Mongodb Node和npm 二文档地址 https://hellosean1025.github.io/yapi/ 三安装步骤 1.安装Mongodb,请参考 2.安装Node,请参 ...