解决vue3.0父传给子的值不随父组件改变而改变

最近自己在学习vue3.0-studying，虽然啥也不是，但是该学的还得学。。。
再练习一个父子传值的案例是遇到了一个问题。就是父组件传给子组件的值，父组件改变的时候而子组件不改变。
原因：子组件中的setup函数只能执行一次，所以组件中的值更新时，子组件就不听话了。。。
解决方法:使用了vue3.0里的watchEffect方法

父传子

1.父组件

父组件:引入子组件，并且把值传给子组件

<template><input type="text" v-model="msg"><HelloWorld :send="msg"/>
</template><script>
import HelloWorld from './components/HelloWorld.vue'
import {reactive,toRefs} from "vue"
export default {setup(){const state = reactive({msg:"hahaha"}) return{...toRefs(state)}} }
</script>

2.子组件

子组件：先用props来接收，然后将接收到值变成响应式–ref

<template><div>{{data}}</div><div>传值啊哈哈哈</div>
</template><script>
import {ref} from "vue"
export default {name: 'HelloWorld',props: {send: String},setup(props){const data = ref(props.send)return{data}},
}
</script>

然后就是它不能随着父组件的值改变而改变。。。
解决后代码如下：

  setup(props){const state = reactive({data:""})watchEffect(()=>{state.data = props.send})return{...toRefs(state)}},

然后就能去改变了。。。然后我就又去细细的看了看官网的解释

官方地址：https://v3.cn.vuejs.org/api/computed-watch-api.html#computed

欧克欧克，如果大佬有其他的解决方法，也可以说出来，增长我的知识，多谢多谢