Bootstrap Vue - передача данных карты в качестве полезной нагрузки

Есть ли аналогичный способ передачи данных карты, таких как rowData, при использовании bootstrap vue?

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

ДАННЫЕ КАРТЫ

Действие...

setCard: function ({commit}, cardData) {
  commit('setCardToState', cardData)
}

Мутация ...

setCardToState (state, cardData) {
  state.addeditinitiative.name = cardData.name
  state.addeditinitiative.description = cardData.description
  state.addeditinitiative.id = cardData.id
},

Шаблон

<b-card v-for="initiative in initiatives" v-b-modal.NewInitiativeModal @click="setCard">
        {{initiative.name}}
      </b-card>

ДАННЫЕ РЯДА

Шаблон

<b-table striped
             hover
             responsive
             :items="products"
             :fields="fields"
             :filter="reportFilter"
             :current-page="currentPage"
             :per-page="10"
             v-b-modal.EditProductModal
             @row-clicked="setRow"></b-table>
  </b-row>

Действие

 setRow: function ({commit}, rowData) {
  commit('setRowToState', rowData)
},

Мутация

setRowToState (state, rowData) {
  state.addeditproduct.name = rowData.name
  state.addeditproduct.productline = rowData.productline
  state.addeditproduct.description = rowData.description
  state.addeditproduct.externalid = rowData.externalid
  state.addeditproduct.active = rowData.active
  state.addeditproduct.id = rowData.id
},

person jmacnc    schedule 18.12.2018    source источник


Ответы (1)


Это может быть проблема с реактивностью Vue. Вы можете использовать deepCopy (например: JSON.parse(JSON.stringify()), чтобы сделать его реактивным

setCardToState (state, cardData) {
  state.addeditinitiative.name = cardData.name
  state.addeditinitiative.description = cardData.description
  state.addeditinitiative.id = cardData.id
  state.addeditinitiative = JSON.parse(JSON.stringify(state.addeditinitiative))
}

Кстати, вы должны добавить :key при использовании v-for

<b-card v-for="(initiative, index) in initiatives" :key="index" v-b-modal.NewInitiativeModal @click="setCard">
        {{initiative.name}}
</b-card>
person ittus    schedule 18.12.2018