vue-layer

1、安装插件

npm i --save vue-layer

2、main.js中添加

import layer from 'vue-layer'

import 'vue-layer/lib/vue-layer.css'

Vue.prototype.$layer = layer(Vue);

3、调用

this.$layer.confirm(`html内容`, {

  btn: ['确定','取消'] ,//按钮

    area:['400px','280px'],

        title:"修改处方",

},

 

this.$layer.confirm('您是如何看待前端开发？', {

  btn: ['重要','奇葩'] //按钮

}, function(){

  that.$layer.closeAll();

  that.$layer.msg('的确很重要', {icon: 1});

}, function(){

  that.$layer.closeAll();

  that.$layer.msg('也可以这样',

  {

    time: 1000, //20s后自动关闭

    btn: ['明白了', '知道了'],  //btn不起作用，待修改

  }

  );

});

 

this.$layer.msg(111)；

this.$layer.alter(111)

 

 

Attribut

{

  type: 0, //0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）

  title: '信息',

  content: '',

  area: 'auto',

  offset: 'auto',

  icon: -1,

  btn: '确定',

  time: 0,

  shade: true,//是否显示遮罩

  yes: '',

  cancel: '',

  tips: [0,{}],//支持上右下左四个方向，通过1-4进行方向设定,可以设定tips: [1, '#c00']

  tipsMore: false,//是否允许多个tips

  shadeClose: true,//点击遮罩是否关闭

  maxmin: true,//开启最大化最小化

  scrollbar: true, //是否允许浏览器出现滚动条:默认是允许

  resize: false //是否允许拉伸，默认是不允许

}

 

注：vue-layer-npm官网：https://www.npmjs.com/package/vue-layer，

       layer官网：https://layer.layui.com/

      在vue-layer中layer.open无法使用