# slide-rang-lt

**Repository Path**: onresize/slide-rang-lt

## Basic Information

- **Project Name**: slide-rang-lt
- **Description**: 一个基于elementUI、vue2封装的滑块验证组件
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-07-26
- **Last Updated**: 2022-08-02

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# slide-rang-lt

> 一个基于elementUI、vue2封装的滑块验证组件

### 安装

---
使用npm 或 yarn安装

``` bash
npm install slide-rang-lt -S
```

```bash
yarn add slide-rang-lt 
```

如果你的网络环境不佳，推荐使用 [cnpm](https://github.com/cnpm/cnpm)。

### Attributes

---

|    属性     |         描述         |   类型   |        默认值         |
| :---------: | :------------------: | :------: | :-------------------: |
| successFun  |   *成功之后的函数*   | Function |           -           |
| successIcon |      *成功图标*      |  String  |    el-icon-success    |
| successText |      *成功文字*      |  String  |       验证成功        |
|  startIcon  |     *开始的图标*     |  String  | el-icon-d-arrow-right |
|  startText  |     *开始的文字*     |  String  |  请拖拽滑块到最右边   |
|  errorFun   |   *失败之后的函数*   | Function |           -           |
|   status    | *或者用值来进行监听* |  String  |           -           |

### Example

```js
// main.js
import slideRangLt from 'slide-rang-lt'
Vue.use(slideRangLt)
```

```vue
<template>
  <div id="app">
    <slide-rang-lt
      status="status"
      :successFun="jcRes"
      :errorFun="jcRej"
    ></slide-rang-lt>
  </div>
</template>

<script>
export default {
  name: "app",
  data() {
    return {};
  },
  methods: {
    jcRes() {
      this.$message.success("操作成功");
    },
    jcRej() {
      this.$message.error("请拖拽到尾部");
    }
  }
};
</script>
```