Vue: Prise en charge des sous-classes de tableaux

Créé le 27 déc. 2018 · 3Commentaires · Source: vuejs/vue

Version

2.5.21

Lien de reproduction

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

Étapes à reproduire

1- créer une classe étendant Array et ajouter une méthode personnalisée
2- instancier une nouvelle instance de la classe et l'ajouter aux données
3- essayez d'appeler la méthode sur l'instance dans le modèle

Qu'est-ce qui est attendu ?

La méthode est exécutée avec succès

Que se passe-t-il réellement ?

L'erreur n'est pas une fonction

feature request

Source

AmrIKhudair

👍1

Commentaire le plus utile

@AmrIKhudair
J'en avais aussi besoin et je l'ai fait fonctionner dans les terres des utilisateurs. Lorsque Vue 3 arrive, vous pouvez le supprimer.

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 le 21 févr. 2019

👍5 🚀2

Tous les 3 commentaires

Vue 2 ne prend actuellement pas en charge les sous-classes Array (la branche de développement Vue 3 le fait déjà). Je vais convertir cela en une demande de fonctionnalité.

yyx990803 le 27 déc. 2018

@AmrIKhudair
J'en avais aussi besoin et je l'ai fait fonctionner dans les terres des utilisateurs. Lorsque Vue 3 arrive, vous pouvez le supprimer.

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 le 21 févr. 2019

👍5 🚀2

@edcoreweb
Merci beaucoup

AmrIKhudair le 22 févr. 2019

Cette page vous a été utile?

0 / 5 - 0 notes