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 45 additions and 28 deletions

View File

@ -33,15 +33,20 @@ app.use(Skeleton);
``` ```
```js ```js
import { ref, onMounted } from 'vue';
export default { export default {
data() { setup() {
const loading = ref(true);
onMounted(() => {
loading.value = false;
});
return { return {
loading: true, loading,
}; };
}, },
mounted() {
this.loading = false;
},
}; };
``` ```

View File

@ -43,15 +43,20 @@ app.use(Skeleton);
``` ```
```js ```js
import { ref, onMounted } from 'vue';
export default { export default {
data() { setup() {
const loading = ref(true);
onMounted(() => {
loading.value = false;
});
return { return {
loading: true, loading,
}; };
}, },
mounted() {
this.loading = false;
},
}; };
``` ```

View File

@ -22,26 +22,33 @@
</template> </template>
<script> <script>
export default { import { ref } from 'vue';
i18n: { import { useTranslate } from '@demo/use-translate';
'zh-CN': {
showAvatar: '显示头像', const i18n = {
showChildren: '显示子组件', 'zh-CN': {
title: '关于 Vant', showAvatar: '显示头像',
desc: showChildren: '显示子组件',
'Vant 是一套轻量、可靠的移动端 Vue 组件库,提供了丰富的基础组件和业务组件,帮助开发者快速搭建移动应用。', title: '关于 Vant',
}, desc:
'en-US': { 'Vant 是一套轻量、可靠的移动端 Vue 组件库,提供了丰富的基础组件和业务组件,帮助开发者快速搭建移动应用。',
showAvatar: 'Show Avatar', },
showChildren: 'Show Children', 'en-US': {
title: 'About Vant', showAvatar: 'Show Avatar',
desc: 'Vant is a set of Mobile UI Components built on Vue.', showChildren: 'Show Children',
}, title: 'About Vant',
}, desc: 'Vant is a set of Mobile UI Components built on Vue.',
},
};
export default {
setup() {
const t = useTranslate(i18n);
const show = ref(false);
data() {
return { return {
show: false, t,
show,
}; };
}, },
}; };