vue install 注册组件
1、myPlugin.js文件
let MyPlugin = {};
MyPlugin.install = function (Vue, options) {
// 1. 添加全局方法或属性
Vue.myGlobalMethod = function () {
// 逻辑...
console.log('myGlobalMethod')
}
// 2. 添加全局资源
Vue.directive('my-directive', {
bind (el, binding, vnode, oldVnode) {
// 逻辑...
}
})
// 3. 注入组件
Vue.mixin({
created: function () {
// 逻辑...
}
})
// 4. 添加实例方法
Vue.prototype.$myMethod = function (methodOptions) {
// 逻辑...
console.log('myMethod')
}
}
export default MyPlugin
2、APP.vue文件
<template> </template>
<script>
import Vue from 'vue'
import MyPlugin from './myPlugin'
Vue.use(MyPlugin) export default {
data() {
return {
}
},
methods: {
},
mounted: function(){
this.$myMethod();
Vue.myGlobalMethod();
}
}
</script>
说明:以上两个文件位于同一目录
组件注册完成,输出:

vue install 注册组件的更多相关文章
- vue统一注册组件
文件夹下面组件数量较多,如果每一个组件先import然后在 components,虽然灭有问题,但是会导致代码量大,而且不直观 解决办法: 将图元组件进行统一注册 新建一个pixels文件,文件里面的 ...
- Vue.js 注册组件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 手把手教你实现一个 Vue 进度条组件!
最近在个人的项目中,想对页面之间跳转的过程进行优化,想到了很多文档或 npm 等都用到的页面跳转进度条,于是便想自己去实现一个,特此记录. 来看下 npm 搜索组件时候的效果: so 下面咱们一起动手 ...
- vue.js之组件(上篇)
本文的Demo和源代码已放到GitHub,如果您觉得本篇内容不错,请点个赞,或在GitHub上加个星星! https://github.com/zwl-jasmine95/Vue_test 以下所有知 ...
- VueJs(8)---组件(注册组件)
组件(注册组件) 一.介绍 组件系统是Vue.js其中一个重要的概念,它提供了一种抽象,让我们可以使用独立可复用的小组件来构建大型应用,任意类型的应用界面都可以抽象为一个组件树 那么什么是组件呢? 组 ...
- vue.js之组件篇
Vue.js 组件 模块化:是从代码逻辑的角度进行划分的: 组件化:是从UI界面的角度进行划分的. 组件(Component)是 Vue.js 最强大的功能之一,组件可以扩展 HTML 元素,封装可重 ...
- Vue 入门之组件化开发
Vue 入门之组件化开发 组件其实就是一个拥有样式.动画.js 逻辑.HTML 结构的综合块.前端组件化确实让大的前端团队更高效的开发前端项目.而作为前端比较流行的框架之一,Vue 的组件和也做的非常 ...
- 详解Vue大护法——组件
1.什么是组件化 人面对复杂问题的处理方式: 任何一个人处理信息的逻辑能力都是有限的 所以,当面对一个非常复杂的问题时,我们不太可能一次性搞定一大堆的内容. 但是,我们人有一种天生的能力,就是将问题进 ...
- vue 自动注册全局组件
vue 自动注册全局组件 vue 注册全局组件的方式 const plugins = { install(Vue) { const requireComponent = require.context ...
随机推荐
- BZOJ 1010: [HNOI2008]玩具装箱toy(DP+斜率优化)
[HNOI2008]玩具装箱toy Description P教授要去看奥运,但是他舍不下他的玩具,于是他决定把所有的玩具运到北京.他使用自己的压缩器进行压缩,其可以将任意物品变成一堆,再放到一种特殊 ...
- 城市改造 (city)
城市改造 (city) 题目描述 为了节约当前社会巨大的能源消耗,A 城市发起了新能源改造计划,也就是用太阳能代替旧能源.为了简化题意,可以假设 A 城市在一个二维平面上,平面上从11到nn每一个地方 ...
- Codeforces Round #304 (Div. 2) D 思维/数学/质因子/打表/前缀和/记忆化
D. Soldier and Number Game time limit per test 3 seconds memory limit per test 256 megabytes input s ...
- Python之数据结构:字符串中的方法
一.过滤字符串 1.strip() (1)去掉行收尾不可见字符 a = ' wejifrow ' print a print a.strip() 结果: wejifrow wejifrow (2)st ...
- JS 监听绑定和取消事件
1. 原生 JS 语言: 绑定:addEventListener(type, function, false) 取消: removeEventListener(type, function, fals ...
- python实现贪吃蛇
贪吃蛇的算法还是比较简单的,蛇的移动我是通过不停添加一个head方块,然后判断应该加到蛇头的哪个方向,加完后删掉蛇尾就行了,如果吃到食物就不删蛇尾. 只是一个贪吃蛇只需要70行代码左右就可以了,后来又 ...
- c++学习重点分析
C++是一种语言,仅仅是它的语法.特性.标准类库就已经是一门非常高深的课程,所以在开始学习的时候,必须先要打好基础.要知道当我们在学习它的时候重点应该注意什么. 一.#include “filena ...
- hdu 3518 Boring counting 后缀数组 height分组
题目链接 题意 对于给定的字符串,求有多少个 不重叠的子串 出现次数 \(\geq 2\). 思路 枚举子串长度 \(len\),以此作为分界值来对 \(height\) 值进行划分. 显然,对于每一 ...
- error: expected class-name before '{' token(转)
错误原因 1. 头文件引用的类中,结尾可能少了; ,, 例如:class Cwj{} 忘记了以;结尾哦. 2. 引用的头文件的顺序先后相互冲突:例如:Msg类中包含了#includ ...
- 泛型数组 + 记录类型 + Json 之间的转换
unit Unit3; interface uses Winapi.Windows, Winapi.Messages, System.SysUtils, System.Variants, System ...