• 057_末晨曦Vue技术_处理边界情况之强制更新和创建低开销的静态组件


    强制更新和创建低开销的静态组件

    点击打开视频讲解更加详细

    强制更新

    如果你发现你自己需要在 Vue 中做一次强制更新,99.9% 的情况,是你在某个地方做错了事。

    你可能还没有留意到数组或对象的变更检测注意事项,或者你可能依赖了一个未被 Vue 的响应式系统追踪的状态。

    然而,如果你已经做到了上述的事项仍然发现在极少数的情况下需要手动强制更新,那么你可以通过 $forceUpdate 来做这件事。

    完整案例:

    
    
    
    
    
    

    通过 v-once 创建低开销的静态组件

    渲染普通的 HTML 元素在 Vue 中是非常快速的,但有的时候你可能有一个组件,这个组件包含了大量静态内容。在这种情况下,你可以在根元素上添加 v-once attribute 以确保这些内容只计算一次然后缓存起来,就像这样:

    Vue.component('terms-of-service', {
      template: `
        

    Terms of Service

    ... a lot of static content ...
    ` })

    再说一次,试着不要过度使用这个模式。当你需要渲染大量静态内容时,极少数的情况下它会给你带来便利,除非你非常留意渲染变慢了,不然它完全是没有必要的——再加上它在后期会带来很多困惑。例如,设想另一个开发者并不熟悉 v-once 或漏看了它在模板中,他们可能会花很多个小时去找出模板为什么无法正确更新。

    若对您有帮助,请点击跳转到B站一键三连哦!感谢支持!!!

  • 相关阅读:
    React基础语法
    【容器】Containerd产生及和Docker对比
    p5.js 到底怎么设置背景图?
    Python面向对象编程
    RHCSA认证考试---12.查找字符串
    人工智能申报!武汉市人工智能创新专项项目申报要求、流程和申报限制
    flutter在导航栏处实现对两个列表的点击事件
    STM32 芯片怎么选型?
    Java-反射
    使用css的transition属性实现抽屉功能
  • 原文地址:https://www.cnblogs.com/mochenxiya/p/16634865.html