vue 3.0中ref与reactive的相似与区别，与使用要点（上篇）

vue一共提供了两种数据响应式监听：ref , reactive

1.ref 函数传入一个值作为参数，返回一个基于该值的响应式Ref对象，该对象中的值一旦被改变和访问，都会被跟踪到，通过修改 count.value 的值，可以触发模板的重新渲染，显示最新的值。

2.其实，除了 ref 函数，Vue3.0中还提供了另外一个可以创建响应式对象的函数，那就是 reactive 函数。
下面就来说说为什么要提供两种API？
解答：
一：使用场景的不同
有的人可能喜欢这种写法

const a = 1
const b = 2

也有的人可能喜欢这种写法

const field = {
  a : 1,
  b : 1    
}

我觉得ref更偏向于定义单个变量，而reactive更偏向定义对象。
第二：使用方式不一样
1、ref修改数据需要使用这样count.value=xxx的形式，而reactive只需要state.reactiveField=值这样来使用

2、第二点体现在template中引用时候为reactiveField，不需要state，也就是说我reactive对象里面字段是应该直接使用的（？？）

3、体现在reactive在return时候需要toRefs来转换成响应式对象

注意：在下篇我们上代码来着重介绍reactive的使用注意事项