JSFiddle - React, Tailwind, and code Playground

HTML

<body id="app">
<table>
  <thead>
    <tr>
      <th>ファイル名</th>
    </tr>
  </thead>
  <tbody>
    <tr v-for='(file,index) in files'>
      <td v-bind:class='{none : flag[index]}'> {{ files[index-1] }}</td>
    </tr>
  </tbody>
  <button v-on:click="switch(0)">
  switch
  </button>
</table>
</body>

CSS

.none{display:none;}

JavaScript

var demo = new Vue({
    name: 'vue-file',
    el: '#app',             // 関連付けるDOMを設定する
    data: {                 // 紐付けるデータを定義
        'files': [1,2,3,4,5,6,7,8,9],        // テーブルへ表示するデータ
        'flag': [true,false,true,false,true,false,true,false,true]         // ファイル名表示フラグ
    },
    method: {
    	switch: function(index) {
      	this.flag[index] = !this.flag[index]
      },
    }
})