Vue笔记07-Vue Watch函数

注意
本文最后更新于 2024-05-18,文中内容可能已过时。

https://blog.meowrain.cn/api/i/2024/01/22/j3a9b9-3.webp

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
<script setup lang="ts">
import {watch,ref} from 'vue'
let source = ref('');
let length = ref(0);
watch(source,(newVal,oldVal)=>{
    console.log(oldVal+"发生变化\n");
    console.log("新值为:"+newVal);
    length.value = source.value.length;
})
</script>
<template>
<input type="text" v-model="source" />
<span>{{ length }}</span>

</template>
<style></style>

也可以监听一个值,当发生变化时候进行异步请求,刷新数据

watch监听属性

https://blog.meowrain.cn/api/i/2024/01/22/r5c220-3.webp


相关内容

0%