Vue3 reactive和ref响应式问题

reactive：一般用来接收复杂类型数据。定义后再取出就不是响应式数据了，这个问题解决方法如下：

reactive接收钩子函数（遇到的是生命周期函数onMounted钩子函数）中axios请求的数据要响应到页面中，应该使用toRefs()，将数据转化为响应式数据。

ref：ref数据响应式监听。

ref 函数传入一个值作为参数，一般传入基本数据类型，返回一个基于该值的响应式Ref对象，该对象中的值一旦被改变和访问，都会被跟踪到，就像我们改写后的示例代码一样，通过修改 data.value 的值，可以触发模板的重新渲染，显示最新的值。