@blueking/date-picker 0.0.1 → 0.0.4

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 CHANGED
@@ -1,12 +1,77 @@
1
1
 
2
2
  <br/>
3
3
 
4
- <br/>
4
+ ### 支持 Vue2/Vue3 版本 无差别使用
5
+ ![show](image.png)
6
+ #### 安装
7
+ ```bash
8
+ npm i @blueking/date-picker
9
+ ```
10
+ #### 使用
11
+ - vue3框架下使用
12
+ ```javascript
13
+ <template>
14
+ <div class="app">
15
+ <DatePicker
16
+ v-model="value"
17
+ v-model:timezone="timezone"
18
+ format="YYYY-MM-DD HH:mm:ss"
19
+ :behavior="'normal'"
20
+ :version="2"
21
+ :disabled="false"
22
+ @update:model-value="handleValueChange"
23
+ />
24
+ </div>
25
+ </template>
26
+ <script setup lang="ts">
27
+ import { ref } from 'vue';
5
28
 
6
- ### 支持 Vue2/Vue3 版本 无差别使用
29
+ import DatePicker from '@blueking/date-picker';
7
30
 
8
- #### 安装使用
9
- ```bash
10
- npm i @blueking/
31
+ // 如果项目已安装bkui-vue 则可使用轻量版本
32
+ import DatePicker from '@blueking/date-picker/dist/vue3-light';
33
+ import '@blueking/date-picker/dist/vue3-light.css';
34
+
35
+ const value = ref(['now-2d/d', 'now',]);
36
+ const timezone = ref('Asia/Shanghai');
37
+ const handleValueChange = (value, info) => {
38
+ console.log(value, info);
39
+ };
40
+ </script>
41
+ ```
42
+
43
+ - vue2框架下使用
44
+ ```javascript
45
+ <template>
46
+ <div class="app">
47
+ <DatePicker
48
+ :modelValue="value"
49
+ :timezone="timezone"
50
+ format="YYYY-MM-DD HH:mm:ss"
51
+ :behavior="'normal'"
52
+ :version="2"
53
+ :disabled="false"
54
+ @update:model-value="handleValueChange"
55
+ />
56
+ </div>
57
+ </template>
58
+ <script lang="ts">
59
+
60
+ import DatePicker from '@blueking/date-picker/dist/vue2-full';
61
+ import '@blueking/date-picker/dist/vue2-full.css'
62
+
63
+ export default {
64
+ data() {
65
+ return {
66
+ value: ['now-2d/d', 'now',],
67
+ timezone: ''
68
+ }
69
+ },
70
+ methods: {
71
+ handleValueChange(value, info) {
72
+ console.log(value, info);
73
+ }
74
+ }
75
+ }
76
+ </script>
11
77
  ```
12
- ![show](image.png)
@@ -52095,7 +52095,7 @@ const AZ = {
52095
52095
  format: this.format || e.format,
52096
52096
  modelValue: this.modelValue || e.modelValue,
52097
52097
  "onUpdate:modelValue"() {
52098
- t("change", ...arguments);
52098
+ t("update:modelValue", ...arguments);
52099
52099
  },
52100
52100
  "onUpdate:timezone"() {
52101
52101
  t("update:timezone", ...arguments);