[Vuejs]-Access Vuex state based on user action

0👍

You should use computed not data to keep reactivity.

computed: {
  files () {
    return store.state.files.files
  }
}

To select a file from store there is many way to achieve it.

data: {
   selectedFile: {}
},
methods:{
   onEdit(file){
     this.selectedFile = file;
   },
   cancelEdit(){
     this.selectedFile = {};
   }
   ...
}

don’t use v-for to hide thing

<b-card
  v-if="selectedFile.id"
  :title="selectedFile.name"
  :sub-title="selectedFile.size"
  class="my-5 selected-file">
</b-card>
<b-card
  v-else
  v-for="(file, id) in files"
  :key="id"
  :title="file.name"
  :sub-title="file.size"
  class="my-5 files">
</b-card>

Leave a comment