Skip to content

Latest commit

 

History

History
34 lines (24 loc) · 2.74 KB

File metadata and controls

34 lines (24 loc) · 2.74 KB

custom ref hard #Composition API #Reactivity:Advanced

By webfansplz @webfansplz

Take the Challenge    简体中文

The debounce function is so useful in the input box manipulation scenarios.

A debounced ref is even more flexible in Vue.js. Lets go 👇:

<script setup>
import { watch } from "vue"

/**
 * Implement the function
*/
function useDebouncedRef(value, delay = 200) {

}
const text = useDebouncedRef("hello")

/**
 * Make sure the callback only gets triggered once when entered multiple times in a certain timeout
*/
watch(text, (value) => {
  console.log(value)
})
</script>

<template>
  <input v-model="text" />
</template>

Back Share your Solutions Check out Solutions