mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
docs(Rate): use composition api
This commit is contained in:
parent
dea44580df
commit
e5df5d734e
@ -19,11 +19,12 @@ app.use(Rate);
|
|||||||
```
|
```
|
||||||
|
|
||||||
```js
|
```js
|
||||||
|
import { ref } from 'vue';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
setup() {
|
||||||
return {
|
const value = ref(3);
|
||||||
value: 3,
|
return { value };
|
||||||
};
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
```
|
```
|
||||||
@ -53,11 +54,12 @@ export default {
|
|||||||
```
|
```
|
||||||
|
|
||||||
```js
|
```js
|
||||||
|
import { ref } from 'vue';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
setup() {
|
||||||
return {
|
const value = ref(2.5);
|
||||||
value: 2.5,
|
return { value };
|
||||||
};
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
```
|
```
|
||||||
@ -87,11 +89,19 @@ export default {
|
|||||||
```
|
```
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
|
import { ref } from 'vue';
|
||||||
|
import { Toast } from 'vant';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
method: {
|
setup() {
|
||||||
onChange(value) {
|
const value = ref(3);
|
||||||
|
const onChange = (value) => {
|
||||||
Toast('current value:' + value);
|
Toast('current value:' + value);
|
||||||
},
|
};
|
||||||
|
return {
|
||||||
|
value,
|
||||||
|
onChange,
|
||||||
|
};
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
```
|
```
|
||||||
|
@ -23,11 +23,12 @@ app.use(Rate);
|
|||||||
```
|
```
|
||||||
|
|
||||||
```js
|
```js
|
||||||
|
import { ref } from 'vue';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
setup() {
|
||||||
return {
|
const value = ref(3);
|
||||||
value: 3,
|
return { value };
|
||||||
};
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
```
|
```
|
||||||
@ -57,11 +58,12 @@ export default {
|
|||||||
```
|
```
|
||||||
|
|
||||||
```js
|
```js
|
||||||
|
import { ref } from 'vue';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
setup() {
|
||||||
return {
|
const value = ref(2.5);
|
||||||
value: 2.5,
|
return { value };
|
||||||
};
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
```
|
```
|
||||||
@ -91,11 +93,19 @@ export default {
|
|||||||
```
|
```
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
|
import { ref } from 'vue';
|
||||||
|
import { Toast } from 'vant';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
method: {
|
setup() {
|
||||||
onChange(value) {
|
const value = ref(3);
|
||||||
|
const onChange = (value) => {
|
||||||
Toast('当前值:' + value);
|
Toast('当前值:' + value);
|
||||||
},
|
};
|
||||||
|
return {
|
||||||
|
value,
|
||||||
|
onChange,
|
||||||
|
};
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
```
|
```
|
||||||
|
@ -45,6 +45,10 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import { toRefs, reactive } from 'vue';
|
||||||
|
import { useTranslate } from '../../composables/use-translate';
|
||||||
|
import Toast from '../../toast';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
i18n: {
|
i18n: {
|
||||||
'zh-CN': {
|
'zh-CN': {
|
||||||
@ -69,8 +73,9 @@ export default {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
data() {
|
setup() {
|
||||||
return {
|
const t = useTranslate();
|
||||||
|
const state = reactive({
|
||||||
value1: 3,
|
value1: 3,
|
||||||
value2: 3,
|
value2: 3,
|
||||||
value3: 3,
|
value3: 3,
|
||||||
@ -78,14 +83,17 @@ export default {
|
|||||||
value5: 4,
|
value5: 4,
|
||||||
value6: 3,
|
value6: 3,
|
||||||
value7: 2,
|
value7: 2,
|
||||||
};
|
});
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
const onChange = (value) => {
|
||||||
onChange(value) {
|
Toast(t('toastContent', value));
|
||||||
this.value7 = value;
|
};
|
||||||
this.$toast(this.t('toastContent', value));
|
|
||||||
},
|
return {
|
||||||
|
...toRefs(state),
|
||||||
|
t,
|
||||||
|
onChange,
|
||||||
|
};
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user