Динамическое добавление данных в data-функцию Vue.js?

Question

[Rooly]

Коллеги, есть ли у кого идеи или реализовать ли кто-то мысль в сторону создание одного модального окна для редактирования разных сущностей.

Чтобы реализовать надуманное мне нужно как-то динамически изменять объект data() в самом компоненте

https://github.com/RasankRam/black_list_frontend/b...

К сожалению, задумка не получилась (в watch'e заполняется как раз объект $data --> this.$data[key] = '', так как я не смог найти способа динамического добавления данных в объект, который возвращается функцией data()

Answer 1

[Антон Антон]

Для этой задачи подходит компонент со слотом и одним свойством - show. все остальное - запихивается извне в слот-содержимое модального окна.

Ну а вообще - если хочется динамически добавлять реактивные свойства - то для этого есть https://ru.vuejs.org/v2/api/#Vue-set
для простоты можно еще на один уровень спуститься и добавлять свойства не корневого объекта, а какого-нибудь его свойства, типа

data() {
  return {
    show: false,
    editableObject: {}
  }
}

но, повторюсь, для модального окна с произвольным содержимым этого не нужно, нужно почитать про слоты

Comments

[PavelEgorov-ru]

Скажи, у тебя получилось это сделать?

[Антон Антон]

PavelEgorov-ru, что конкретно? компонент модального окна со слотом для содержимого? да, конечно.