使用computed 改变参数值

 1 <template>
 2   <input
 3     type="text"
 4     v-model="tagsStr"
 5     placeholder="请输入标签,多个标签用英文逗号隔开"
 6   />
 7 </template>
 8 
 9 <script lang="ts">
10 import { defineComponent, computed, ref } from 'vue'
11 
12 export default defineComponent({
13   setup() {
14     // 这个是最终要用到的数组
15     const tags = ref<string[]>([])
16 
17     // 因为input必须绑定一个字符串
18     const tagsStr = computed({
19       // 所以通过getter来转成字符串
20       get() {
21         return tags.value.join(',')
22       },
23       // 然后在用户输入的时候,切割字符串转换回数组
24       set(newValue: string) {
25         tags.value = newValue.split(',')
26       },
27     })
28 
29     return {
30       tagsStr,
31     }
32   },
33 })
34 </script>

 

来自于: https://vue3.chengpeiquan.com/component.html#不同类型的数据转换

 

 
posted @ 2022-07-09 10:44  googlegis  阅读(655)  评论(0编辑  收藏  举报

坐标合肥,非典型GIS开发人员 GitHub