Передайте класс для реквизита в Vuejs

1

Я новичок в vue. Мне недавно нужно передать класс в качестве реквизита для компонента. Как показано ниже:

<my-component v-for="(name, index) in Names" :key="'name-' + index " :person="new Person(name)"></my-component>

Лицо, как показано ниже:

class Person {
 constructor(name) {
   this.name = name
 }
}

Имена - это данные с сервера. Проблема заключается в том, что я обновляю имя, используя this.$props.person.name = 'Ken', он не изменяется. Я смотрю на $props.person, он пропустил __ob__: Observer. Пожалуйста помоги!!!

  • 0
    Я думаю. Обнаружение косяка
  • 0
    Разве вы не получаете большое предупреждение о пропаже :key введите ваш v-for ?
Показать ещё 5 комментариев
Теги:
vuejs2

1 ответ

0
Лучший ответ

Возможно, это помогает:

  1. Добавить лиц: [] в ваше состояние
  2. Используйте массив лиц в вашем v-for
  3. Нажимайте или вставляйте новых лиц в массив, используя имена

<my-component v-for="(person, index) in persons" :key="'name-' + index " :person="person"></my-component>

this.names.forEach(name=>this.persons.push(new Person(name));

Другие вещи...

Если ваше имя уникально для человека, используйте его в своем ключе, а не в индексе, или даже лучше, добавьте поле идентификатора для персонализации для оптимизации вставок, удалений и т.д.

Вы также можете поместить свои имена в состояние и отреагировать на изменения, добавив людей в функцию часов.

Возможно, вы захотите сделать глубокие часы внутри своего компонента. Однако этот код не был опубликован.

  • 0
    Спасибо, кажется, это единственное решение, не могли бы вы объяснить, почему новый человек в реквизит не работает?
  • 1
    Разве решение не работает? Похоже, заявленный подход создает нового человека на каждом рендере. Это решение создает его один раз и сохраняет экземпляр в массиве состояний, который может быть реактивным.
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню