Vue循环列表下加隐藏框

最近遇见一个需求需要在列表下加一个隐藏框，点击才展示出来 网上看了一下结合自己的需要写了一个例子出来

<div id="app">
  <ol>
    <li v-for="site in sites">
      {{ site.name }} 
		<input type="button" @click="test(site)" value="点击"/>
		<div v-if="site.isOk">
			{{ site.name }}
		</div>
    </li>
  </ol>
</div>

利用v-for循环，隐藏条件也根据循环出来的site里面值来进行判别，
但是后台传的数据不会专门为了这个给你加一个字段，需要自己添加一个判断值。
于是用到

Vue.set(obj,'isOk',false);

以下为假设后台传入数据不存在判断字段，自己进行添加

<script>
new Vue({
  el: '#app',
  data: {
    sites: []
  },
  created() {
  	const data1=[
  	  { name: 'Runoob'},
  	  { name: 'Google'},
  	  { name: 'Taobao'}
  	];
	for (var i = 0; i < data1.length; i++) {
		var obj={}
		Vue.set(obj, 'name', data1[i].name);
		Vue.set(obj,'isOk',false);
		console.log(obj)
		this.sites.push(obj);
	}
  },
  methods: {
  	test(site){
	site.isOk = !site.isOk;
	}
  }
})
</script>