vue3 的 toRaw() 和 markRaw()

toRaw()要求传入一个由 reactive生成的响应式对象，然后将该对象转为非响应式的普通对象

let person = reactive({
    name: 'tm',         
    age: 18,            
    job: {              
        job1: {         
            salary: 20  
        }
    }
})

const p = toRaw(person) 
console.log(p); //{name: 'tm', age: 18, job: {…}}

markRaw()标记一个普通对象，使之永远不会成为响应式对象

let person = reactive({
    name: 'tm',         
    age: 18,            
    job: {              
        job1: {         
            salary: 20  
        }
    }
})

let car = {name: 'BMW', price: 40}
// person.car = car // 这样加到person上，默认就是响应式的，因为person是由reactive创建的
person.car = markRaw(car) //使用markRaw后，person.car就不是响应式的了