vue 将组件绑定到vue 中 用函数调用思路

1、引入vue

import Vue from 'vue'

2、引入组件

import alert from '../components/commons/alert/index.vue'

3、扩展vue

const alertBox = Vue.extend(alert)

4、声明函数 传入options

function alertBoxx (options){

5、new一个新对象

var alert = new alertBox({

6、创建el

el:document.createElement('div'),

7、添加数据

data(){

return{

Obj:{

isshow:true,

message:options.content,

btns:{

confirm:true,

cancel:true

}

}

}

},

8、添加方法

methods:{

confirm:options.callback

}

})

9、获取body 并将元素添加到body

document.querySelector('body').appendChild(alert.$el)

 

Vue.nextTick(()=>{

alert.Obj.isshow= true

})

}

10、挂载到vue 并暴露

function install(){

Vue.prototype.$alert= alertBoxx

}

export default install

你可能感兴趣的:(vue 将组件绑定到vue 中 用函数调用思路)