Vue: 支持数组子类化

创建于 2018-12-27 · 3评论 · 资料来源: vuejs/vue

版本

2.5.21

转载链接

https://codepen.io/AmrIKhudair/pen/NevxML

重现步骤

1- 创建一个扩展 Array 的类并添加自定义方法
2-实例化该类的一个新实例并将其添加到数据中
3-尝试调用模板中实例的方法

什么是预期？

方法执行成功

实际发生了什么？

错误不是函数

feature request

资料来源

AmrIKhudair

👍1

最有用的评论

@AmrIKhudair
我也需要这个，并让它在用户领域工作。当 Vue 3 到来时，您可以将其删除。

export function makeReactive (obj) {
  // eslint-disable-next-line no-proto
  const proto = obj.__proto__

  Object.defineProperty(obj, '__proto__', {
    get () { return proto },
    // eslint-disable-next-line no-proto
    set (newValue) { proto.__proto__ = newValue }
  })
}

import { makeReactive } from 'util'

export default class UserCollection extends Array {
  constructor (...args) {
    super(...args)

    makeReactive(this)
  }
}

edcoreweb 于 2019-02-21

👍5 🚀2

所有3条评论

Vue 2 目前不支持 Array 子类化（Vue 3 开发分支已经支持）。我会将其转换为功能请求。

yyx990803 于 2018-12-27

@AmrIKhudair
我也需要这个，并让它在用户领域工作。当 Vue 3 到来时，您可以将其删除。

export function makeReactive (obj) {
  // eslint-disable-next-line no-proto
  const proto = obj.__proto__

  Object.defineProperty(obj, '__proto__', {
    get () { return proto },
    // eslint-disable-next-line no-proto
    set (newValue) { proto.__proto__ = newValue }
  })
}

import { makeReactive } from 'util'

export default class UserCollection extends Array {
  constructor (...args) {
    super(...args)

    makeReactive(this)
  }
}

edcoreweb 于 2019-02-21

👍5 🚀2

@edcoreweb
非常感谢

AmrIKhudair 于 2019-02-22

此页面是否有帮助？

0 / 5 - 0 等级