Vue,Vuex:在嵌套的反应式类中访问私有属性

问题描述

给出以下Vuex状态:

{
  model: new Model
}

以下型号:

import { DataModel } from '@/foundation/data-model'
import { Child } from '@/models/child'

export class Model extends DataModel {
  static defaults = {
    name: null,child: new Child
  }

  constructor(payload = null) {
    super(Model.defaults)

    if (payload) this.hydrate({
      ...payload,child: new OtherModel(payload.child)
    })
  }
}

孩子:

import { DataModel } from '@/foundation/data-model'

export class Child extends DataModel {
  static defaults = {
    name: null
  }

  constructor(payload = null) {
    super(Child.defaults)
    this.hydrate(payload)
  }

  // other methods,setters,and getters.
}

和数据模型:

import { assign,cloneDeep } from 'lodash'

export class DataModel {
  #noHistory = false
  #originals = {}

  constructor(payload = null,noHistory = false) {
    this.#noHistory = noHistory
    this.hydrate(payload || {})
  }

  hydrate(payload = null,withOriginals = true) {
    if (!payload) return
    if (!payload instanceof Object) throw 'DataModel: payload is not an object'
    if (withOriginals && !this.noHistory) this.#originals = cloneDeep({ ...payload })

    assign(this,cloneDeep({ ...payload }))

    return this
  }

  get originals() {
    return this.#originals
  }

  // other getters and methods
}

为什么我可以通过根#originals(处于Vuex状态)中的originals访问model,但不能通过model.child.#originals访问model.child.originals

如果我尝试这样做,我会得到:

TypeError:尝试在非实例上获取私有字段

model.originals // returns an object containing the original payload
model.child.originals // throws the TypeError

这可能是由于Vue或Vuex包装对象以使其具有反应性的方式吗?如果是这样,为什么它只适用于model.child而不适用于model,我如何解决呢?

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)