Vue3 toRaw 与 markRaw
1、toRaw
作用：返回将reactive，readonly， shallowReactive 或者 shallowReadonly 这个四个方法包裹的原始数据。如下图
toRaw返回的数据与包裹之前的数据一个地址值数据，也就是两个数据是相等。
注意：toRaw不能乱用，因为会使数据失去响应式。
2、markRaw
作用：标记数据不可变为代理数据，也就是reactive，readonly， shallowReactive 或者 shallowReadonly 这四个方式不能将markRaw标记的数据转为响应式数据。官网也解释为什么用markRaw的理由：
- 有些值根本不应该是被动的，例如复杂的第三方类实例或Vue组件对象。
- 当呈现具有不可变数据源的大型列表时，跳过代理转换可以提高性能。
用法如下图：
可以看出对象mark是没有被代理的，通过markRaw包裹的数据，vue3会自动给这个数据添加一个__v_skip属性，值为true，代理的时候会根据__v_skip的属性值判断是否代理。
注意：如果单独用mark数据中某一个属性，照样也能被代理，因为markRaw作用的是这一个整体数据，而不是没有作用到数据中每一个属性，也可以理解为markRaw是一个浅包裹，不是一个深度包裹。
原文地址：https://blog.csdn.net/qq_41742576/article/details/136314408
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！