[Vuejs]-Comparing DataTables headers for filtering in Vuetify?

by

0👍

You can do this; not best solution but that is work;

<body>
<div id="app-2">
    <table>
        <thead>
            <tr>
                <td v-for="head in headers">{{head.text}}</td>
            </tr>
            <tr>
                <td v-for="head in headers">{{head.value}}</td>
            </tr>
        </thead>
    </table>
</div>

 <script>
   var app2 = new Vue({
    el: '#app-2',
    data: {
        headers: [
          {
           text: '1',
           align: 'left',
           value: 'month'
          },
          {
           text: '2',
           align: 'left',
           value: 'month'
          },
          {
           text: '3',
           align: 'left',
           value: 'month'
           },
           {
            text: '4',
            align: 'left',
            value: 'month'
           }
        ]
    }
})
var array = [
 {
     month: 1,
     value: 200
 },
{
    month: 2,
    value: 300
},
{
    month: 3,
    value: 400
},
{
    month: 4,
    value: 500
}
];

for (var i = 0; i < array.length; i++) {
    for (var k = 0; k < array.length; k++) {
        if (array[i].month == app2.$data.headers[k].text) {
            (app2.$data.headers[k].value = array[i].value)
        }
    }

}

Leave a comment