# myselfdeelement-ui

> myselfelement-UI 是一款基于 Vue.js 2.0 的前端 UI 组件库，主要用于快速开发 PC 网站中后台产品

Latest version **1.0.0** (published 2022-02-21) · ISC license · 0 weekly downloads

## Install

```sh
npm install myselfdeelement-ui
pnpm add myselfdeelement-ui
yarn add myselfdeelement-ui
bun add myselfdeelement-ui
```

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.0 |
| Published | 2022-02-21 |
| First published | 2022-02-21 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 451.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | zhanzhuhong |

## Links

- npm: https://www.npmjs.com/package/myselfdeelement-ui
- npm.io page: https://npm.io/package/myselfdeelement-ui

## Recent versions

- 1.0.0 (latest) — 2022-02-21

## README

# 说明
> myselfdeelement-ui-UI 是一款基于 Vue.js 2.0 的前端 UI 组件库，主要用于快速开发 PC 网站中后台产品

# 安装
```
cnpm i myselfdeelement-ui -S
```

# 使用
```
在src/main.js
import QfUI from '@/qfui';
Vue.use(QfUI);


```

# 组件

## Progress 进度条
```
<div>
     <fieldset>
        <legend>{{title}}</legend>
        <slot></slot>
    </fieldset>
  </div>
<script>
export default {
    name: 'Progress',
    props: {
        title: {
            type: String
        }
    },
}
```

## 分页
```
  <div class="page">
    <span v-for="n in total" v-bind:key="n" @click="changePageFn(n)">{{n}}</span>
  </div>
<script>
export default {
  name: "qfui-page",
  props: {
    total: {
      type: Number
    }
  },

  methods: {
    changePageFn(n) {
      this.$emit("changePageFn", n);
    }
  }
};
</script>
```


## 链接文字
```
  <div>
    <el-tag v-for="tag in tags" :key="tag.name" closable :type="tag.type">{{tag.name}}</el-tag>
  </div>
<script>
  export default {
    name:"Textr",
    data() {
      return {
        tags: [
          { name: '标签一', type: '' },
          { name: '标签二', type: 'success' },
          { name: '标签三', type: 'info' },
          { name: '标签四', type: 'warning' },
          { name: '标签五', type: 'danger' }
        ]
      };
    }
  }
</script>
```

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