关于vue3中watchEffect与watch的疑问

Z时代
2024-02-07
分类：IT

<template>
  <input v-model="value" type="text" @input="handleInputChange" /></template>

setup() {
  const value = ref('')
  watchEffect(async onInvalidate => {
    console.log(value.value); // 初始化也会被监听到
    onInvalidate(() => {
      console.log('?');
    });
  });
  function handleInputChange() {
    let stopWatch: WatchStopHandle = () => {};
    if (value.value.length > 5) {
      stopWatch = watch(value, (val, preVal) => {
        console.log(`输入框老值:${val}，新值:${preVal}`);
      });
    } else {
      stopWatch();
    }
  }
  return {
    value,
    handleInputChange
  };}