vue3-layer 1.0.12 → 1.0.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +24 -67
- package/package.json +11 -2
- package/src/vue3-layer.d.ts +2 -0
package/README.md
CHANGED
|
@@ -1,67 +1,24 @@
|
|
|
1
|
-
# Vue3-Layer 弹出层
|
|
2
|
-
|
|
3
|
-
[](https://github.com/
|
|
4
|
-
[](https://github.com/
|
|
5
|
-
[]()
|
|
6
|
-
|
|
7
|
-
vue3-layer 是一款基于 layer.js 上层封装的 vue3 组件，100%支持 layer.js 的 API
|
|
8
|
-
|
|
9
|
-
##
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
#
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
<head>
|
|
26
|
-
<!-- 引入样式 -->
|
|
27
|
-
<link rel="stylesheet" href="//unpkg.com/vue3-layer/dist/s3layer.css" />
|
|
28
|
-
<!-- 引入 Vue -->
|
|
29
|
-
<script src="//unpkg.com/vue@next"></script>
|
|
30
|
-
<!-- 引入组件库 -->
|
|
31
|
-
<script src="//unpkg.com/vue3-layer/dist/s3layer.umd.min.js"></script>
|
|
32
|
-
</head>
|
|
33
|
-
```
|
|
34
|
-
|
|
35
|
-
## 使用
|
|
36
|
-
|
|
37
|
-
```vue
|
|
38
|
-
<template>
|
|
39
|
-
<s3-layer v-model="visible" :title="title" @success="success" @end="end">
|
|
40
|
-
<span>this is vue3-layer</span>
|
|
41
|
-
</s3-layer>
|
|
42
|
-
<button @click="visible = true">显示</button>
|
|
43
|
-
</template>
|
|
44
|
-
|
|
45
|
-
<script setup>
|
|
46
|
-
import { ref } from 'vue'
|
|
47
|
-
import { s3Layer } from 'vue3-layer'
|
|
48
|
-
import 'vue3-layer/dist/s3layer.css'
|
|
49
|
-
|
|
50
|
-
const visible = ref(false)
|
|
51
|
-
const title = ref('标题')
|
|
52
|
-
|
|
53
|
-
const success = (layero, index) => {
|
|
54
|
-
console.log('success', layero, index)
|
|
55
|
-
}
|
|
56
|
-
const end = () => {
|
|
57
|
-
console.log('end')
|
|
58
|
-
}
|
|
59
|
-
</script>
|
|
60
|
-
|
|
61
|
-
<style>
|
|
62
|
-
* {
|
|
63
|
-
margin: 0;
|
|
64
|
-
padding: 0;
|
|
65
|
-
}
|
|
66
|
-
</style>
|
|
67
|
-
```
|
|
1
|
+
# Vue3-Layer 弹出层
|
|
2
|
+
|
|
3
|
+
[](https://github.com/liicos/vue3-layer)
|
|
4
|
+
[](https://github.com/liicos)
|
|
5
|
+
[](http://vue-layer.then66.top)
|
|
6
|
+
|
|
7
|
+
vue3-layer 是一款基于 layer.js 上层封装的 vue3 组件，100%支持 layer.js 的 API
|
|
8
|
+
|
|
9
|
+
## 为什么写这个组件
|
|
10
|
+
|
|
11
|
+
如果你对 layer.js 的 UI 风格足够熟悉，你会发现国内使用 layer.js 的网站非常之多，然而基于 jQuery 的它并不能很好的适配 MVVM 的开发模式，开发这个组件的目的就是为了让大家在 Vue 中也能方便的使用这个多功能弹出层 ~
|
|
12
|
+
|
|
13
|
+
## 通过 npm 或者 yarn 安装
|
|
14
|
+
|
|
15
|
+
```shell
|
|
16
|
+
# npm
|
|
17
|
+
npm install vue3-layer --save
|
|
18
|
+
# yarn
|
|
19
|
+
yarn add vue3-layer
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## [示例 (Example)](http://vue-layer.then66.top/guide/start.html)
|
|
23
|
+
|
|
24
|
+
## [文档 (Document)](http://vue-layer.then66.top)
|
package/package.json
CHANGED
|
@@ -1,9 +1,17 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "vue3-layer",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.15",
|
|
4
4
|
"main": "dist/s3Layer.umd.min.js",
|
|
5
5
|
"author": "legad",
|
|
6
6
|
"description": "基于 vue3 的Web 通用弹出层组件",
|
|
7
|
+
"keywords": [
|
|
8
|
+
"vue-layer",
|
|
9
|
+
"vue-modal",
|
|
10
|
+
"vue-dialog",
|
|
11
|
+
"vue3-modal",
|
|
12
|
+
"vue3-dialog",
|
|
13
|
+
"vue3-layer"
|
|
14
|
+
],
|
|
7
15
|
"homepage": "https://github.com/liicos/vue3-layer",
|
|
8
16
|
"scripts": {
|
|
9
17
|
"serve": "vue-cli-service serve",
|
|
@@ -39,5 +47,6 @@
|
|
|
39
47
|
"dist",
|
|
40
48
|
"public",
|
|
41
49
|
"src"
|
|
42
|
-
]
|
|
50
|
+
],
|
|
51
|
+
"types": "src/vue3-layer.d.ts"
|
|
43
52
|
}
|