vue3 watch如何件挺props传过来的参数变化呢

在 Vue 3 中，你可以使用 watch 来监听从父组件传递过来的 props 的变化。下面是一个简单的示例，演示如何实现这一点。

假设你有一个子组件 Child.vue，它接收一个名为 myProp 的 prop：

<template>
  <div>
    <p>当前的 prop 值: {{ myProp }}</p>
  </div>
</template>

<script>
import { defineComponent, watch } from 'vue';

export default defineComponent({
  props: {
    myProp: {
      type: String,
      required: true
    }
  },
  setup(props) {
    // 监听 myProp 的变化
    watch(
      () => props.myProp,
      (newValue, oldValue) => {
        console.log(`myProp 发生变化: 从 ${oldValue} 变为 ${newValue}`);
      }
    );

    return {
      // 返回 props 或其他数据给模板使用
    };
  }
});
</script>

在这个例子中，我们使用了 watch 来监听 myProp 的值。当 myProp 的值发生变化时，回调函数会被调用，并打印出新的和旧的值。

关键点：

1. 在 setup 函数中使用 watch。
2. 第一个参数是一个函数，返回你想要监听的值（在这里是 props.myProp）。
3. 第二个参数是一个回调函数，接受新值和旧值作为参数。

通过这种方式，你可以对从父组件传递来的 props 进行监控，并在其变化时执行相应的逻辑。