J'essaie d'utiliser b-form-checkbox avec b-table. Essayez de récupérer l'ID du module sélectionné.
<b-table
id="module-table"
:items="list.modules"
:fields="fields"
:busy="isBusy">
<template slot="num" slot-scope="row">
{{ row.index + 1 }}
</template>
<template slot="checkbox" slot-scope="row">
<b-form-group>
<b-form-checkbox v-if="!isLoading" v-model="row.item.selected" @change="selection(row.item.moduleId)" variant="outline-secondary" class="mr-1">
</b-form-checkbox>
</b-form-group>
</template>
</b-table>
data: {
fields: [
{ key: 'checkbox', label: '', class: 'd-none d-lg-table-cell' },
{ key: 'num', label: 'Num', class: 'd-none d-lg-table-cell' },
],
selected: []
}
Bien que je puisse récupérer les ID de module sélectionnés, je ne peux pas les supprimer lorsque je coche la case. Si quelqu'un pouvait donner une idée sur la façon de savoir si une case est cochée (vrai) ou décochée (faux). Merci d'avance.
methods: {
selection(item) {
if (true)
app.selected.push(item);
else
app.selected = app.selected.map(x => x != item);
}
}, 
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Valeur de la case à cocher passée
v-model存储在list.modules[].selected中，因此您可以仅使用计算的 prop 来获取所选模块，而不是使用单独的selectedTableau :<b-form-checkbox>中删除@change="selection(⋯)":selection方法和selectedles attributs de données car ils ne sont plus nécessaires.export default { data() { return { // selected: [] // remove } }, methods: { // selection() {⋯} // remove } }list.modules[]:export default { computed: { selected() { return this.list.modules.filter(module => module.selected) }, }, }Démo