V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
marcong95
V2EX  ›  程序员

在 Vue.js 中,组件里并不需要 reactive 的实例变量还应该放在 data 里面吗?

  •  1
     
  •   marcong95 · 2018-07-19 17:07:58 +08:00 · 2776 次点击
    这是一个创建于 2319 天前的主题,其中的信息可能已经有所发展或是发生改变。

    例如说现在有一个组件里面创建了一个比较复杂的对象,这个对象只是一个 helper 性质的东西,对象的成员是完全不需要 reactive 的。那这个对象还应该放在 data 里面吗?

    感觉由于 vue 会对这个对象的所有属性加上 getter/setter 之类的,可能会导致一些例如性能之类的奇奇怪怪的问题。

    3 条回复    2018-07-20 10:28:51 +08:00
    yesC
        1
    yesC  
       2018-07-19 17:34:28 +08:00
    noe132
        2
    noe132  
       2018-07-19 17:38:28 +08:00
    如果东西不多,当然随意。
    如果你用写类的方式写 Vue 组件,就不会有这个问题,因为实例属性就是 Vue 的 data

    不过因为 Vue 的响应式是对 data 里所有的对象深层遍历安装 getter setter 的,所以如果不是数量特别多,比如几千几万几十万这种,通常没有性能问题。而且,如果你的属性没有在 render 函数里被访问到,或者被其他的渲染函数用到的计算属性依赖,通常是不会有副作用的,修改这些属性不会触发重新渲染。
    marcong95
        3
    marcong95  
    OP
       2018-07-20 10:28:51 +08:00
    @yesC 这倒是个方法,但是文档说「它们可能和 Vue 内置的属性、API 方法冲突。」,也不知道会不会有坑

    @noe132 有些对象的确是有可能很大,例如 echarts 的实例,里面各种循环引用,我怀疑还真有点肉眼可见的性能问题。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2676 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 03:37 · PVG 11:37 · LAX 19:37 · JFK 22:37
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.