Q:

Event on table td

I create Vue table component and i have items and columns.
    items: [
        {
            'id':'1',
            'title': '<input type="text">',
            'description': '<input type="text">',
            'price': '<input type="number">'
        },
        {
            'id':'2',
            'title': '<input type="text">',
            'description': '<input type="text">',
            'price': '<input type="number">'
        }
    ],
    columns: [ 'id', 'title', 'description', 'price']

And my template is
     <table class="table">
      <thead>
          <tr>
              <th v-for="(column, index) in columns" :key="index"> {{column}}</th>
          </tr>
      </thead>
      <tbody>
          <tr v-for="(item, index) in items" :key="index">
              <td v-for="(column, indexColumn) in columns" :key="indexColumn" v-html="item[column]"></td>
          </tr>
      </tbody>
    </table>

Hove i bint v-on:keyup event only on price column? I want only price column have trigger calculate metod. 
    methods: {
        calculate: function () {
          // to do...
        }
    }

A:

Since the keyup event bubbles, you could just add an event handler to the appropriate <td> elements.
<td 
    v-for="(column, indexColumn) in columns" 
    :key="indexColumn" 
    v-html="item[column]"
    v-on="column === 'price' ? {'keyup': calculate} : {}"
/>

