Vue3.0API介绍中 shallowReactive 使用示例
导读：Vue3.0API介绍中 shallowReactive 使用示例 shallowReactive 创建一个响应式代理，它跟踪其自身 property 的响应性，但不执行嵌套对象的深层响应式转换 (暴露原始值 。 import {...
Vue3.0API介绍中 shallowReactive 使用示例
shallowReactive
创建一个响应式代理，它跟踪其自身 property 的响应性，但不执行嵌套对象的深层响应式转换 (暴露原始值)。
import {
shallowReactive, isReactive }
from "vue";
const state = shallowReactive({
foo: 1,
nested: {
bar: 2
}
}
)
// 改变 state 本身的性质是响应式的
state.foo++
// ...但是不转换嵌套对象
console.log(isReactive(state.nested)) // false
state.nested.bar++ // 非响应式
与 reactive 不同，任何使用 ref 的 property 都不会被代理自动解包。
shallowReadonly
创建一个 proxy，使其自身的 property 为只读，但不执行嵌套对象的深度只读转换 (暴露原始值)。
import {
shallowReadonly, isReadonly }
from "vue";
const state = shallowReadonly({
foo: 1,
nested: {
bar: 2
}
}
)
// 改变 state 本身的 property 将失败
state.foo++
console.log(isReadonly(state))
// ...但适用于嵌套对象
console.log(isReadonly(state.nested)) // false
state.nested.bar++ // 适用
与 readonly 不同，任何使用 ref 的 property 都不会被代理自动解包。
声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！
若转载请注明出处： Vue3.0API介绍中 shallowReactive 使用示例
本文地址： https://pptw.com/jishu/655737.html