[Vuejs]-Change style attribute of a generated div on click

by

0👍

✅

this refers to Vue instance not to the clicked element so you should do :

 methods: {
   colorize(event) {
     if(this.$store.state.picked === 1) {
       event.target.style.backgroundColor="rgb(103, 103, 103)";
     }
   }
 }

new Vue({
  el: '#app',
  data() {
    return {
      elements: [
      {content:'content 1',tooltip:'tool tip 1'},
      {content:'content 2',tooltip:'tool tip 2'},
      {content:'content 3',tooltip:'tool tip 3'},
      {content:'content 4',tooltip:'tool tip 4'},
      ]
    }
  }
, methods: {
   colorize(event) {
 
       event.target.style.backgroundColor="rgb(103, 103, 103)";
     
   }
 }
})
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

<div id="app" data-app>

 <div class="row">
     <div class="hour" v-on:click="colorize" v-for="n in elements">
     {{n.content}}
     </div>
   </div>
</div>
👤Boussadjra Brahim

Leave a comment