docs(Skeleton): use composition api

This commit is contained in:
chenjiahan
2020-12-13 12:51:02 +08:00
parent 71d5a27dc4
commit f93e21a099
3 changed files with 44 additions and 27 deletions
+10 -5
View File
@@ -33,15 +33,20 @@ app.use(Skeleton);
```
```js
import { ref, onMounted } from 'vue';
export default {
data() {
setup() {
const loading = ref(true);
onMounted(() => {
loading.value = false;
});
return {
loading: true,
loading,
};
},
mounted() {
this.loading = false;
},
};
```
+10 -5
View File
@@ -43,15 +43,20 @@ app.use(Skeleton);
```
```js
import { ref, onMounted } from 'vue';
export default {
data() {
setup() {
const loading = ref(true);
onMounted(() => {
loading.value = false;
});
return {
loading: true,
loading,
};
},
mounted() {
this.loading = false;
},
};
```
+24 -17
View File
@@ -22,26 +22,33 @@
</template>
<script>
import { ref } from 'vue';
import { useTranslate } from '@demo/use-translate';
const i18n = {
'zh-CN': {
showAvatar: '显示头像',
showChildren: '显示子组件',
title: '关于 Vant',
desc:
'Vant 是一套轻量、可靠的移动端 Vue 组件库,提供了丰富的基础组件和业务组件,帮助开发者快速搭建移动应用。',
},
'en-US': {
showAvatar: 'Show Avatar',
showChildren: 'Show Children',
title: 'About Vant',
desc: 'Vant is a set of Mobile UI Components built on Vue.',
},
};
export default {
i18n: {
'zh-CN': {
showAvatar: '显示头像',
showChildren: '显示子组件',
title: '关于 Vant',
desc:
'Vant 是一套轻量、可靠的移动端 Vue 组件库,提供了丰富的基础组件和业务组件,帮助开发者快速搭建移动应用。',
},
'en-US': {
showAvatar: 'Show Avatar',
showChildren: 'Show Children',
title: 'About Vant',
desc: 'Vant is a set of Mobile UI Components built on Vue.',
},
},
setup() {
const t = useTranslate(i18n);
const show = ref(false);
data() {
return {
show: false,
t,
show,
};
},
};