docs(AddressEdit): use composition api

src/address-edit/README.md

@@ -30,34 +30,39 @@ app.use(AddressEdit);
 ```
 
 ```js
+import { ref } from 'vue';
 import { Toast } from 'vant';
 
 export default {
-  data() {
+  setup() {
-    return {
+    const searchResult = ref([]);
-      areaList,
+
-      searchResult: [],
+    const onSave = () => {
-    };
-  },
-  methods: {
-    onSave() {
       Toast('save');
-    },
+    };
-    onDelete() {
+    const onDelete = () => {
       Toast('delete');
-    },
+    };
-    onChangeDetail(val) {
+    const onChangeDetail = (val) => {
       if (val) {
-        this.searchResult = [
+        searchResult.value = [
           {
-            name: '黄龙万科中心',
+            name: 'Name1',
-            address: '杭州市西湖区',
+            address: 'Address',
           },
         ];
       } else {
-        this.searchResult = [];
+        searchResult.value = [];
       }
-    },
+    };
+
+    return {
+      onSave,
+      onDelete,
+      areaList,
+      searchResult,
+      onChangeDetail,
+    };
   },
 };
 ```

src/address-edit/README.zh-CN.md

@@ -34,34 +34,39 @@ app.use(AddressEdit);
 ```
 
 ```js
+import { ref } from 'vue';
 import { Toast } from 'vant';
 
 export default {
-  data() {
+  setup() {
-    return {
+    const searchResult = ref([]);
-      areaList,
+
-      searchResult: [],
+    const onSave = () => {
-    };
-  },
-  methods: {
-    onSave() {
       Toast('save');
-    },
+    };
-    onDelete() {
+    const onDelete = () => {
       Toast('delete');
-    },
+    };
-    onChangeDetail(val) {
+    const onChangeDetail = (val) => {
       if (val) {
-        this.searchResult = [
+        searchResult.value = [
           {
             name: '黄龙万科中心',
             address: '杭州市西湖区',
           },
         ];
       } else {
-        this.searchResult = [];
+        searchResult.value = [];
       }
-    },
+    };
+
+    return {
+      onSave,
+      onDelete,
+      areaList,
+      searchResult,
+      onChangeDetail,
+    };
   },
 };
 ```

src/address-edit/demo/index.vue

@@ -15,11 +15,13 @@
   </demo-block>
 </template>
 
-<script>
+<script lang="ts">
+import { ref } from 'vue';
+import { useTranslate } from '@demo/use-translate';
+import Toast from '../../toast';
 import areaList from '../../area/demo/area';
 
-export default {
+const i18n = {
-  i18n: {
   'zh-CN': {
     areaColumnsPlaceholder: ['请选择', '请选择', '请选择'],
     searchResult: [
@@ -52,27 +54,32 @@ export default {
       },
     ],
   },
-  },
-
-  data() {
-    return {
-      areaList,
-      searchResult: [],
 };
-  },
 
-  methods: {
+export default {
-    onSave() {
+  setup() {
-      this.$toast(this.t('save'));
+    const t = useTranslate(i18n);
-    },
+    const searchResult = ref([]);
 
-    onDelete() {
+    const onSave = () => {
-      this.$toast(this.t('delete'));
+      Toast(t('save'));
-    },
+    };
 
-    onChangeDetail(val) {
+    const onDelete = () => {
-      this.searchResult = val ? this.t('searchResult') : [];
+      Toast(t('delete'));
-    },
+    };
+
+    const onChangeDetail = (val: string) => {
+      searchResult.value = val ? t('searchResult') : [];
+    };
+
+    return {
+      onSave,
+      onDelete,
+      areaList,
+      searchResult,
+      onChangeDetail,
+    };
   },
 };
 </script>