<template>
<div class="container-fluid wraper">
<h2>{{ msg }}</h2>
<input type="text" v-model="msg">
</div>
</template>
<script setup lang="ts" name="App">
import { ref,customRef } from 'vue'
// 使用vue提供的默认ref定义响应式数据,数据一遍,页面更新
// let msg = ref('你好')
// 使用vue提供的customRef定义响应式数据
let initValue = '你好'
// track(跟踪) trigger(触发)
let timer:number;
let msg = customRef((track,trigger)=>{
return{
get(){
track() //告诉vue数据msg很重要,你对msg进行持续关注,一旦msg变化就去更新
return initValue
},
set(value){
clearTimeout(timer)
timer = setTimeout(() => {
initValue = value
trigger() //通知vue数据msg变化了
}, 1000);
}
}
})
</script>
12-10
809
07-29
254
“相关推荐”对你有帮助么?
-
非常没帮助
-
没帮助
-
一般
-
有帮助
-
非常有帮助
提交