第五章、CompositionAPI 中的toRefs,toRef,toRaw,markRaw

一、toRaw： 将代理对象转换为目标对象；

proxy ->target； 不懂请先理解ES6中的Proxy

二、toRef：主要用于解构响应对象的单个属性；并且保持响应连接； toRefs相当于为响应式对象每个可枚举（存在的属性），创建ref,即批量创建ref

toRefs <=> toRef() + toRef() + .....

const state = reactive({
  foo: 1,
  bar: {
    foobar: 2
  }
})

const stateRefs = toRefs(state)  // const {foo,bar} = toRefs(state) ,不会丢失响应式
// 等价于
const stateRefs = {
  foo: toRef(state, 'foo'),
  bar: toRef(state, 'bar')
}

三、unRef :如果参数是 ref，则返回内部值，否则返回参数本身;

unRef(val) 等价与 isRef(val) ? val.value : val4

const count = ref(0)   // 0 -> 响应式
const countVal = unRef(count); // number 0

四、markRaw: 将一个对象标记为不可被转为代理。返回该对象本身;

const state = reactive({
  foo: 1,
  bar: markRaw({
    baz: 2
  })
})

const changeState = () =>{
  state.bar = 3;  //  注意 state.bar 具有响应式
  // state.bar.baz = 3;  // state.bar.baz 不具有响应式，
}