index.vue 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. <template>
  2. <demo-section>
  3. <demo-block :title="$t('basicUsage')">
  4. <van-address-edit
  5. :area-list="areaList"
  6. show-postal
  7. show-delete
  8. show-set-default
  9. show-search-result
  10. :search-result="searchResult"
  11. @save="onSave"
  12. @delete="onDelete"
  13. @change-detail="onChangeDetail"
  14. />
  15. </demo-block>
  16. </demo-section>
  17. </template>
  18. <script>
  19. import areaList from '../../area/demo/area';
  20. export default {
  21. i18n: {
  22. 'zh-CN': {
  23. searchResult: [{
  24. name: '黄龙万科中心',
  25. address: '杭州市西湖区'
  26. }, {
  27. name: '黄龙万科中心G座'
  28. }, {
  29. name: '黄龙万科中心H座',
  30. address: '杭州市西湖区'
  31. }]
  32. },
  33. 'en-US': {
  34. searchResult: [{
  35. name: 'Name1',
  36. address: 'Address'
  37. }, {
  38. name: 'Name2'
  39. }, {
  40. name: 'Name3',
  41. address: 'Address'
  42. }]
  43. }
  44. },
  45. data() {
  46. return {
  47. areaList,
  48. searchResult: []
  49. };
  50. },
  51. methods: {
  52. onSave() {
  53. this.$toast(this.$t('save'));
  54. },
  55. onDelete() {
  56. this.$toast(this.$t('delete'));
  57. },
  58. onChangeDetail(val) {
  59. this.searchResult = val ? this.$t('searchResult') : [];
  60. }
  61. }
  62. };
  63. </script>