blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-05 05:42:44 +08:00
Code Issues Projects Releases Wiki Activity

docs: improve demo translating

Browse Source
This commit is contained in:
chenjiahan 2020-12-11 10:07:07 +08:00
parent b3dfb4997f
commit 09858eb1d3
15 changed files with 281 additions and 248 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
docs/site/use-translate.ts Normal file
View File

@ -0,0 +1,22 @@
import Locale from '../../src/locale';
import { camelize } from '../../src/utils/format/string';
import { createTranslate } from '../../src/utils/create/translate';
let demoUid = 0;
export function useTranslate(i18n: Record<string, any>) {
const demoName = `demo-i18n-${demoUid++}`;
if (i18n) {
const locales = {};
const camelizedName = camelize(demoName);
Object.keys(i18n).forEach((key) => {
locales[key] = { [camelizedName]: i18n[key] };
});
Locale.add(locales);
}
return createTranslate(demoName);
}

3
jest.config.js
View File

@ -6,4 +6,7 @@ module.exports = {
'!**/test/**',
'!**/lang/**',
],
moduleNameMapper: {
'^@demo(.*)$': '<rootDir>/docs/site$1',
},
};

11
src/action-sheet/demo/index.vue
View File

@ -53,11 +53,10 @@
<script>
import { computed, reactive, toRefs } from 'vue';
import { useTranslate } from '../../composables/use-translate';
import { useTranslate } from '@demo/use-translate';
import Toast from '../../toast';
export default {
i18n: {
const i18n = {
'zh-CN': {
option1: '选项一',
option2: '选项二',
@ -86,10 +85,11 @@ export default {
disabledOption: 'Disabled Option',
showDescription: 'Show Description',
},
},
};
export default {
setup() {
const t = useTranslate();
const t = useTranslate(i18n);
const state = reactive({
show: {
basic: false,
@ -129,6 +129,7 @@ export default {
return {
...toRefs(state),
t,
onSelect,
onCancel,
simpleActions,

8
src/composables/use-translate.ts
View File

@ -1,8 +0,0 @@
import { getCurrentInstance } from 'vue';
import { noop } from '../utils';
import { createTranslate } from '../utils/create/translate';
export function useTranslate() {
const { name } = getCurrentInstance()!.type;
return name ? createTranslate(name) : noop;
}

11
src/count-down/demo/index.vue
View File

@ -42,11 +42,10 @@
<script>
import { ref } from 'vue';
import { useTranslate } from '@demo/use-translate';
import Toast from '../../toast';
import { useTranslate } from '../../composables/use-translate';
export default {
i18n: {
const i18n = {
'zh-CN': {
reset: '重置',
pause: '暂停',
@ -69,10 +68,11 @@ export default {
manualControl: 'Manual Control',
formatWithDay: 'DD Day, HH:mm:ss',
},
},
};
export default {
setup() {
const t = useTranslate();
const t = useTranslate(i18n);
const time = ref(30 * 60 * 60 * 1000);
const countDown = ref(null);
@ -90,6 +90,7 @@ export default {
};
return {
t,
time,
start,
pause,

11
src/dialog/demo/index.vue
View File

@ -29,11 +29,10 @@
<script>
import { ref } from 'vue';
import { useTranslate } from '../../composables/use-translate';
import { useTranslate } from '@demo/use-translate';
import Dialog from '..';
export default {
i18n: {
const i18n = {
'zh-CN': {
alert1: '提示弹窗',
alert2: '提示弹窗（无标题）',
@ -51,10 +50,11 @@ export default {
roundButton: 'Round Button Style',
componentCall: 'Component Call',
},
},
};
export default {
setup() {
const t = useTranslate();
const t = useTranslate(i18n);
const show = ref(false);
const onClickAlert = () => {
@ -106,6 +106,7 @@ export default {
};
return {
t,
show,
image: 'https://img.yzcdn.cn/vant/apple-3.jpg',
onClickAlert,

2
src/dialog/test/__snapshots__/demo.spec.js.snap
View File

@ -121,7 +121,7 @@ exports[`should render demo and match snapshot 1`] = `
>
<div class="van-button__content">
<span class="van-button__text">
Confirm dialog
Confirm
</span>
</div>
</button>

25
src/image-preview/demo/index.vue
View File

@ -35,19 +35,11 @@
<script>
import { reactive, toRefs } from 'vue';
import { useTranslate } from '../../composables/use-translate';
import { useTranslate } from '@demo/use-translate';
import ImagePreview from '..';
import Toast from '../../toast';
const images = [
'https://img.yzcdn.cn/vant/apple-1.jpg',
'https://img.yzcdn.cn/vant/apple-2.jpg',
'https://img.yzcdn.cn/vant/apple-3.jpg',
'https://img.yzcdn.cn/vant/apple-4.jpg',
];
export default {
i18n: {
const i18n = {
'zh-CN': {
closed: '关闭',
showClose: '展示关闭按钮',
@ -70,10 +62,18 @@ export default {
componentCall: 'Component Call',
index: (index) => `Page: ${index}`,
},
},
};
const images = [
'https://img.yzcdn.cn/vant/apple-1.jpg',
'https://img.yzcdn.cn/vant/apple-2.jpg',
'https://img.yzcdn.cn/vant/apple-3.jpg',
'https://img.yzcdn.cn/vant/apple-4.jpg',
];
export default {
setup() {
const t = useTranslate();
const t = useTranslate(i18n);
const state = reactive({
show: false,
index: 0,
@ -113,6 +113,7 @@ export default {
return {
...toRefs(state),
t,
images,
onClose,
onChange,

11
src/pull-refresh/demo/index.vue
View File

@ -43,11 +43,10 @@
<script>
import { computed, onMounted, reactive, toRefs } from 'vue';
import { useTranslate } from '../../composables/use-translate';
import { useTranslate } from '@demo/use-translate';
import Toast from '../../toast';
export default {
i18n: {
const i18n = {
'zh-CN': {
try: '下拉试试',
text: '刷新次数',
@ -62,10 +61,11 @@ export default {
successTip: 'Success Tip',
customTips: 'Custom Tips',
},
},
};
export default {
setup() {
const t = useTranslate();
const t = useTranslate(i18n);
const state = reactive({
count: 0,
loading: false,
@ -101,6 +101,7 @@ export default {
return {
...toRefs(state),
t,
tips,
onRefresh,
};

10
src/rate/demo/index.vue
View File

@ -46,11 +46,10 @@
<script>
import { toRefs, reactive } from 'vue';
import { useTranslate } from '../../composables/use-translate';
import { useTranslate } from '@demo/use-translate';
import Toast from '../../toast';
export default {
i18n: {
const i18n = {
'zh-CN': {
halfStar: '半星',
disabled: '禁用状态',
@ -71,10 +70,11 @@ export default {
changeEvent: 'Change Event',
toastContent: (value) => `current value：${value}`,
},
},
};
export default {
setup() {
const t = useTranslate();
const t = useTranslate(i18n);
const state = reactive({
value1: 3,
value2: 3,

11
src/search/demo/index.vue
View File

@ -53,11 +53,10 @@
<script>
import { reactive, toRefs } from 'vue';
import { useTranslate } from '../../composables/use-translate';
import { useTranslate } from '@demo/use-translate';
import Toast from '../../toast';
export default {
i18n: {
const i18n = {
'zh-CN': {
label: '地址',
disabled: '禁用搜索框',
@ -76,10 +75,11 @@ export default {
customButton: 'Custom Action Button',
listenToEvents: 'Listen to Events',
},
},
};
export default {
setup() {
const t = useTranslate();
const t = useTranslate(i18n);
const state = reactive({
value1: '',
value2: '',
@ -99,6 +99,7 @@ export default {
return {
...toRefs(state),
t,
onSearch,
onCancel,
};

11
src/slider/demo/index.vue
View File

@ -52,11 +52,10 @@
<script>
import { reactive, toRefs } from 'vue';
import { useTranslate } from '../../composables/use-translate';
import { useTranslate } from '@demo/use-translate';
import Toast from '../../toast';
export default {
i18n: {
const i18n = {
'zh-CN': {
text: '当前值：',
title1: '基础用法',
@ -79,10 +78,11 @@ export default {
customStyle: 'Custom Style',
customButton: 'Custom Button',
},
},
};
export default {
setup() {
const t = useTranslate();
const t = useTranslate(i18n);
const state = reactive({
value1: 50,
value2: [20, 60],
@ -101,6 +101,7 @@ export default {
return {
...toRefs(state),
t,
onChange,
};
},

11
src/swipe/demo/index.vue
View File

@ -65,11 +65,10 @@
<script>
import { ref } from 'vue';
import { useTranslate } from '../../composables/use-translate';
import { useTranslate } from '@demo/use-translate';
import Toast from '../../toast';
export default {
i18n: {
const i18n = {
'zh-CN': {
title2: '懒加载',
title3: '监听 change 事件',
@ -86,10 +85,11 @@ export default {
title6: 'Custom indicator',
message: 'Current Swipe index:',
},
},
};
export default {
setup() {
const t = useTranslate();
const t = useTranslate(i18n);
const current = ref(0);
const images = [
'https://img.yzcdn.cn/vant/apple-1.jpg',
@ -107,6 +107,7 @@ export default {
};
return {
t,
images,
current,
onChange1,

11
src/switch/demo/index.vue
View File

@ -38,11 +38,10 @@
<script>
import { reactive, toRefs } from 'vue';
import { useTranslate } from '../../composables/use-translate';
import { useTranslate } from '@demo/use-translate';
import Dialog from '../../dialog';
export default {
i18n: {
const i18n = {
'zh-CN': {
title: '标题',
confirm: '提醒',
@ -61,10 +60,11 @@ export default {
customColor: 'Custom Color',
asyncControl: 'Async Control',
},
},
};
export default {
setup() {
const t = useTranslate();
const t = useTranslate(i18n);
const state = reactive({
checked: true,
checked2: true,
@ -85,6 +85,7 @@ export default {
return {
...toRefs(state),
t,
onUpdateValue,
};
},

7
webpack.config.js
View File

@ -1,3 +1,5 @@
const { join } = require('path');
module.exports = function () {
if (process.env.BUILD_TARGET === 'package') {
return {};
@ -8,5 +10,10 @@ module.exports = function () {
entry: {
'site-mobile': ['./docs/site/mobile'],
},
resolve: {
alias: {
'@demo': join(__dirname, 'docs', 'site'),
},
},
};
};