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

docs(AddressList): use composition api

Browse Source
This commit is contained in:
chenjiahan 2020-12-13 12:34:50 +08:00
parent 7cf8637f7f
commit 1e79f28ae5
4 changed files with 159 additions and 140 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/address-edit/demo/index.vue
View File

@ -74,6 +74,7 @@ export default {
}; };
return { return {
t,
onSave, onSave,
onDelete, onDelete,
areaList, areaList,

72
src/address-list/README.md
View File

@ -27,44 +27,50 @@ app.use(AddressList);
``` ```
```js ```js
import { ref } from 'vue';
import { Toast } from 'vant'; import { Toast } from 'vant';
export default { export default {
data() { setup() {
return { const chosenAddressId = ref('1');
chosenAddressId: '1', const list = [
list: [ {
{ id: '1',
id: '1', name: 'John Snow',
name: 'John Snow', tel: '13000000000',
tel: '13000000000', address: 'Somewhere',
address: 'Somewhere', isDefault: true,
isDefault: true, },
}, {
{ id: '2',
id: '2', name: 'Ned Stark',
name: 'Ned Stark', tel: '1310000000',
tel: '1310000000', address: 'Somewhere',
address: 'Somewhere', },
}, ];
], const disabledList = [
disabledList: [ {
{ id: '3',
id: '3', name: 'Tywin',
name: 'Tywin', tel: '1320000000',
tel: '1320000000', address: 'Somewhere',
address: 'Somewhere', },
}, ];
],
}; const onAdd = () => {
},
methods: {
onAdd() {
Toast('Add'); Toast('Add');
}, };
onEdit(item, index) { const onEdit = (item, index) => {
Toast('Edit:' + index); Toast('Edit:' + index);
}, };
return {
list,
onAdd,
onEdit,
disabledList,
chosenAddressId,
};
}, },
}; };
``` ```

72
src/address-list/README.zh-CN.md
View File

@ -31,44 +31,50 @@ app.use(AddressList);
``` ```
```js ```js
import { ref } from 'vue';
import { Toast } from 'vant'; import { Toast } from 'vant';
export default { export default {
data() { setup() {
return { const chosenAddressId = ref('1');
chosenAddressId: '1', const list = [
list: [ {
{ id: '1',
id: '1', name: '张三',
name: '张三', tel: '13000000000',
tel: '13000000000', address: '浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室',
address: '浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室', isDefault: true,
isDefault: true, },
}, {
{ id: '2',
id: '2', name: '李四',
name: '李四', tel: '1310000000',
tel: '1310000000', address: '浙江省杭州市拱墅区莫干山路 50 号',
address: '浙江省杭州市拱墅区莫干山路 50 号', },
}, ];
], const disabledList = [
disabledList: [ {
{ id: '3',
id: '3', name: '王五',
name: '王五', tel: '1320000000',
tel: '1320000000', address: '浙江省杭州市滨江区江南大道 15 号',
address: '浙江省杭州市滨江区江南大道 15 号', },
}, ];
],
}; const onAdd = () => {
},
methods: {
onAdd() {
Toast('新增地址'); Toast('新增地址');
}, };
onEdit(item, index) { const onEdit = (item, index) => {
Toast('编辑地址:' + index); Toast('编辑地址:' + index);
}, };
return {
list,
onAdd,
onEdit,
disabledList,
chosenAddressId,
};
}, },
}; };
``` ```

154
src/address-list/demo/index.vue
View File

@ -12,83 +12,89 @@
</demo-block> </demo-block>
</template> </template>
<script> <script lang="ts">
import { ref } from 'vue';
import { useTranslate } from '@demo/use-translate';
import Toast from '../../toast';
const i18n = {
'zh-CN': {
list: [
{
id: '1',
name: '张三',
tel: '13000000000',
address: '浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室',
isDefault: true,
},
{
id: '2',
name: '李四',
tel: '1310000000',
address: '浙江省杭州市拱墅区莫干山路 50 号',
},
],
disabledList: [
{
id: '3',
name: '王五',
tel: '1320000000',
address: '浙江省杭州市滨江区江南大道 15 号',
},
],
add: '新增地址',
edit: '编辑地址',
disabledText: '以下地址超出配送范围',
defaultTagText: '默认',
},
'en-US': {
list: [
{
id: '1',
name: 'John Snow',
tel: '13000000000',
address: 'Somewhere',
isDefault: true,
},
{
id: '2',
name: 'Ned Stark',
tel: '1310000000',
address: 'Somewhere',
},
],
disabledList: [
{
id: '3',
name: 'Tywin',
tel: '1320000000',
address: 'Somewhere',
},
],
add: 'Add',
edit: 'Edit',
disabledText: 'The following address is out of range',
defaultTagText: 'Default',
},
};
export default { export default {
i18n: { setup() {
'zh-CN': { const t = useTranslate(i18n);
list: [ const chosenAddressId = ref('1');
{ const onAdd = () => {
id: '1', Toast(t('add'));
name: '张三', };
tel: '13000000000', const onEdit = (item: unknown, index: number) => {
address: '浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室', Toast(`${t('edit')}:${index}`);
isDefault: true,
},
{
id: '2',
name: '李四',
tel: '1310000000',
address: '浙江省杭州市拱墅区莫干山路 50 号',
},
],
disabledList: [
{
id: '3',
name: '王五',
tel: '1320000000',
address: '浙江省杭州市滨江区江南大道 15 号',
},
],
add: '新增地址',
edit: '编辑地址',
disabledText: '以下地址超出配送范围',
defaultTagText: '默认',
},
'en-US': {
list: [
{
id: '1',
name: 'John Snow',
tel: '13000000000',
address: 'Somewhere',
isDefault: true,
},
{
id: '2',
name: 'Ned Stark',
tel: '1310000000',
address: 'Somewhere',
},
],
disabledList: [
{
id: '3',
name: 'Tywin',
tel: '1320000000',
address: 'Somewhere',
},
],
add: 'Add',
edit: 'Edit',
disabledText: 'The following address is out of range',
defaultTagText: 'Default',
},
},
data() {
return {
chosenAddressId: '1',
}; };
},
methods: { return {
onAdd() { t,
this.$toast(this.t('add')); onAdd,
}, onEdit,
chosenAddressId,
onEdit(item, index) { };
this.$toast(`${this.t('edit')}:${index}`);
},
}, },
}; };
</script> </script>