0

Im developing a web page and I have a problem with that sentence. Nothing happens when I click on the element.

<li  v-for="(item,indice) of tasks" v-on:click="{{item.klik}}"> 
        <a> <img v-bind:src="item.src" ><b v-bind:id="item.id"> {{item.title}}</b></li>

Also I declared everything:

var vm = new Vue({
    el: "#app",
    data: {
      tasks: [
        {
          title: 'NUEVA RECEPCIÓN',
          src: 'images/add.png',
          id: 'item-title2',
          klik: 'toggle_visibility()'
        },
        {
          title: 'EDITAR RECEPCIÓN ',
          src: 'images/document_check_edit.png',
          id: 'item-title3',
          klik: 'none'
        },
        {
          title: 'ELIMINAR RECEPCIÓN ',
          src: 'images/error.png',
           id: 'item-title4',
        },
        {
          title: 'FINALIZAR RECEPCIÓN ',
          src: 'images/check.png',
           id: 'item-title5',
        },
        {
          title: 'ASIGNAR MATERIAL ',
          src: 'images/box_into.png',
           id: 'item-title6',
        },
        {
          title: 'ELIMINAR MATERIAL ',
          src: 'images/box_out.png',
           id: 'item-title7',
        },
        {
          title: 'IMPRIMIR ETIQUETA ',
          src: 'images/receipt_printer.png',
           id: 'item-title8',
        },
      ]
    }
  })

Does anyone know why when I click on the element nothing happens? Thank you!

Bert
  • 80,741
  • 17
  • 199
  • 164
  • It should be `v-on:click="item.klik"` to begin with but I doubt that will work since you are mapping your `klik` property to strings and not actual methods. If you want to map to methods you should at least remove the single quotes around stuff like: `toggle_visibility()`. – Stephan-v Oct 30 '17 at 15:13
  • Actually there is another problem here. Even if you bind `item.klik`, its not going to call that function necessarily. – Bert Oct 30 '17 at 15:13
  • Here's how I might handle that click. https://codepen.io/Kradek/pen/bYNvJb?editors=1010 – Bert Oct 30 '17 at 15:25

0 Answers0