vue开发插件_旧址_前端开发者

1 新建plugin.js,文件内容如下

import name1 from './name1.vue'
let MyPlugin={} MyPlugin.install = function (vue, options) { // 1. 添加全局方法或属性 vue.myGlobalMethod = function () { // 逻辑... } // 2. 添加全局资源 vue.directive('my-directive', { bind (el, binding, vnode, oldVnode) { // 逻辑... } ... }) // 3. 注入组件选项 vue.mixin({ created: function () { // 逻辑... } ... }) // 4. 添加实例方法 vue.prototype.$myMethod = function (methodOptions) { // 逻辑... }
Vue.component(name1.name,name1)//name1.name是组件name1的name属性(这个是注册全局组件,以后不需要引入,直接就可以用) } export
default MyPlugin;
import name1 from './name1.vue'
let MyPlugin={} MyPlugin.install = function (Vue, options) { // 1. 添加全局方法或属性 Vue.myGlobalMethod = function () { // 逻辑... } // 2. 添加全局资源 Vue.directive('my-directive', { bind (el, binding, vnode, oldVnode) { // 逻辑... } ... }) // 3. 注入组件选项 Vue.mixin({ created: function () { // 逻辑... } ... }) // 4. 添加实例方法 Vue.prototype.$myMethod = function (methodOptions) { // 逻辑... }
Vue.component(name1.name,name1)//name1.name是组件name1的name属性(这个是注册全局组件,以后不需要引入,直接就可以用) } export
default MyPlugin;

{}
MyPlugin.install
function (Vue, options) {
// 1. 添加全局方法或属性 function () {
// 逻辑… }

// 2. 添加全局资源my-directive, {
bind (el, binding, vnode, oldVnode) {
// 逻辑… }

})

// 3. 注入组件选项 Vue.mixin({
created: function () {
// 逻辑… }

})

// 4. 添加实例方法 function (methodOptions) {
// 逻辑… }
Vue.component(name1.name,name1)//name1.name是组件name1的name属性(这个是注册全局组件,以后不需要引入,直接就可以用)
}
export

default

2 在main.js中引入

import MyPlugin from './plugin/plugin.js'
Vue.use(MyPlugin)
import MyPlugin from './plugin/plugin.js'
Vue.use(MyPlugin)

from./plugin/plugin.js
Vue.use(MyPlugin)

至此,方式属性已经全局引入,在vue页面可以使用

» 本文来自:前端开发者 » 《vue开发插件_旧址_前端开发者》
» 本文链接地址:https://www.rokub.com/73269.html
» 您也可以订阅本站:https://www.rokub.com
赞(0)
64K

评论 抢沙发

评论前必须登录!