# h-model-cpmponent

> ## 一、使用方式

Latest version **0.0.3** (published 2023-08-22) · MIT license · 0 weekly downloads

## Install

```sh
npm install h-model-cpmponent
pnpm add h-model-cpmponent
yarn add h-model-cpmponent
bun add h-model-cpmponent
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities.

Warnings: low downloads; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.3 |
| Published | 2023-08-22 |
| First published | 2023-08-22 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 4 |
| Unpacked size | 815.1 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| Author | kuangshp@126.com |
| Maintainers | h1455483319 |
| Keywords | vue, model, maucash, maucash-model |

## Links

- npm: https://www.npmjs.com/package/h-model-cpmponent
- Homepage: https://github.com/kuangshp/maucash-model
- npm.io page: https://npm.io/package/h-model-cpmponent

## Dependencies (4)

- [vue](https://npm.io/package/vue.md) ^2.6.10
- [core-js](https://npm.io/package/core-js.md) ^2.6.5
- [vue-class-component](https://npm.io/package/vue-class-component.md) ^7.0.2
- [vue-property-decorator](https://npm.io/package/vue-property-decorator.md) ^8.1.0

## Recent versions

- 0.0.3 (latest) — 2023-08-22
- 0.0.2 — 2023-08-22
- 0.0.1 — 2023-08-22

## README

# maucash-model

## 一、使用方式

- 1、安装

  ```shell
  npm install maucash-model
  ```

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

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

* 3、组件中使用

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

  ```js
  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` |

---
_Source: https://npm.io/package/h-model-cpmponent · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._