Vue: ΠŸΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΊΠ° подкласса массива

Π‘ΠΎΠ·Π΄Π°Π½Π½Ρ‹ΠΉ Π½Π° 27 Π΄Π΅ΠΊ. 2018  Β·  3ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ  Β·  Π˜ΡΡ‚ΠΎΡ‡Π½ΠΈΠΊ: vuejs/vue

ВСрсия

2.5.21

Бсылка для воспроизвСдСния

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

ДСйствия ΠΏΠΎ Π²ΠΎΡΠΏΡ€ΠΎΠΈΠ·Π²Π΅Π΄Π΅Π½ΠΈΡŽ

1- ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ класс, Ρ€Π°ΡΡˆΠΈΡ€ΡΡŽΡ‰ΠΈΠΉ массив, ΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ собствСнный ΠΌΠ΅Ρ‚ΠΎΠ΄
2- ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π½ΠΎΠ²Ρ‹ΠΉ экзСмпляр класса ΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π΅Π³ΠΎ Π² Π΄Π°Π½Π½Ρ‹Π΅
3- ΠΏΠΎΠΏΡ€ΠΎΠ±ΡƒΠΉΡ‚Π΅ Π²Ρ‹Π·Π²Π°Ρ‚ΡŒ ΠΌΠ΅Ρ‚ΠΎΠ΄ экзСмпляра Π² шаблонС

Π§Ρ‚ΠΎ оТидаСтся?

ΠœΠ΅Ρ‚ΠΎΠ΄ ΡƒΡΠΏΠ΅ΡˆΠ½ΠΎ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½

Π§Ρ‚ΠΎ Π½Π° самом Π΄Π΅Π»Π΅ происходит?

Ошибка Π½Π΅ функция

Π‘Π°ΠΌΡ‹ΠΉ ΠΏΠΎΠ»Π΅Π·Π½Ρ‹ΠΉ ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

@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)
  }
}

ВсС 3 ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

Vue 2 Π² настоящСС врСмя Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°Π΅Ρ‚ подклассы массивов (Π²Π΅Ρ‚ΠΊΠ° Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ Vue 3 ΡƒΠΆΠ΅ ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°Π΅Ρ‚). Π― ΠΊΠΎΠ½Π²Π΅Ρ€Ρ‚ΠΈΡ€ΡƒΡŽ это Π² запрос Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ.

@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
Π‘ΠΎΠ»ΡŒΡˆΠΎΠ΅ спасибо

Π‘Ρ‹Π»Π° Π»ΠΈ эта страница ΠΏΠΎΠ»Π΅Π·Π½ΠΎΠΉ?
0 / 5 - 0 Ρ€Π΅ΠΉΡ‚ΠΈΠ½Π³ΠΈ