• 首页
  • css3教程
  • html5教程
  • jQuery手册
  • vue手册
  • php手册
  • MySQL手册
  • apache手册
  • redis手册
  • markRaw()

    标记一个对象,使其永远不会转换为代理。返回对象本身。

    const foo = markRaw({})
    console.log(isReactive(reactive(foo))) // false
    
    // 嵌套在其他响应式对象中时也可以使用
    const bar = reactive({ foo })
    console.log(isReactive(bar.foo)) // false
    


    下方的markRaw和 shallowXXX API 使你可以有选择地选择退出默认的深度响应式/只读转换,并将原始的,非代理的对象嵌入状态图中。它们可以在各种情况下使用:


    • 有些值不应被设置为响应式的,例如复杂的第三方类实例或 Vue 组件对象。
    • 当渲染具有不可变数据源的大列表时,跳过代理转换可以提高性能。

    它们被认为是高阶的,因为原始选择退出仅在根级别,因此,如果将嵌套的、未标记的原始对象设置为响应式对象,然后再次访问它,则可以得到代理版本。这可能会导致本源危害——即执行依赖于对象本身但同时使用同一对象的原始版本和代理版本的操作:

    const foo = markRaw({
    nested: {}
    })
    
    const bar = reactive({
    // 虽然 `foo` 被标记为原始,foo.nested 不是。
    nested: foo.nested
    })
    
    console.log(foo.nested === bar.nested) // false
    

    本源危害通常很少见。然而,为了在安全地避免本源危害的同时正确地使用这些 API,需要对响应性系统的工作原理有一个坚实的理解。

    上篇:reactive()

    下篇:shallowReactive()