maucash-model

一、使用方式

• 1、安装

  npm install maucash-model

• 2、在项目中的main.js文件中引入

  import MaucashModel from 'maucash-model';
  import 'maucash-model/lib/maucash-model.css';
  Vue.use(MaucashModel);

• 3、组件中使用

  <button @click="openModel">点击打开弹框</button>
  <maucash-model v-model="model" draggable>内容</maucash-model>

  export default {
    data() {
      return {
        model: false,
      };
    },
    methods: {
      openModel() {
        this.model = true;
      },
    },
  };

二、主要的API

| 参数 | 类型 | 说明 | 默认值 | | :---------------: | :--------: | ------------------------------ | ------- | | title | String | 标题 | 空 | | isHideHeader | Boolean | 是否隐藏头部 | false | | isHideFooter | Boolean | 是否隐藏底部 | false | | closeFunc | Function | 关闭按钮的回调函数 | | | closeText | String | 关闭按钮的文字 | 取消 | | confirmFunc | Function | 确认按钮的回调函数 | | | confirmText | Function | 确认按钮的文字 | 确认 | | render | Function | 自定义底部,自己写一个jsx语法 | | | width | Number | 弹框的宽度 | 450 | | height | Number | 弹框的高度 | 300 | | bodyStyle | Object | 内容体的样式 | {} | | draggable | Boolean | 是否可拖拽 | false | | isHideCloseBtn | Boolean | 是否隐藏取消按钮 | false | | isHideConfimBtn | Boolean | 是否隐藏确认按钮 | false |