v-if
当页面加载了Vue.js后，可以在DOM元素上加入v-if属性，用于该DOM元素的显示与隐藏
<h2>v-if</h2>
<div id="score">
<input type="text" placeholder="最低分" v-model="scoreMin">
<p v-for="data in scoreArr" v-if="data.score >= scoreMin">
{{data.name}} : {{data.score}}
</p>
</div>
<script>
var scorevm = new Vue({
el: '#score_demo',
data: {
scoreArr: [
{score: 60, name:"Emilio1"},
{score: 70, name:"Emilio2"},
{score: 80, name:"Emilio3"},
{score: 90, name:"Emilio4"},
{score: 100, name:"Emilio5"}
],
scoreMin: 60
}
});
</script>
上面的代码中v-for实现列表显示数据，v-for节点上加入v-if判断，scoreMin默认值设为60，使用v-model与input形成双向绑定。
条件判断逻辑：data.score > scoreMin，其中data.score是v-for中scoreArr数据源枚举出的对象data的score值。
如此一来，就可以轻松的筛选出成绩大于60的人显示出来。
需要注意的是: 不要把v-if放在 Vue 实例绑定的根节点上，否则你会看到下面的报错。
[Vue warn]: v-if="XXXXX" cannot be used on an instance root element.
Vue实例
实例对象的属性值
<script>
var vmData = { data: 1 };
var vm = new Vue({
el: '#vm_demo',
data: vmData
});
</script>
vm.data === vmData.date，注意这里使用的是 ===
vm.data === vm.$data.data，自带属性使用 $ +自带属性名称
了解以上这两点，就可以避免不必要的数据绑定关系。即当一个js变量的初始值，是需要引用时，不建议和Vue对象绑定上关系，这样很有可能会在不知不觉中改变了变量的值
watch
<script>
vm.$watch('data', function(){
console.log('Change!!!' + new Date());
});
</script>
当data的值发生改变时，会触发它对应的watch方法
Change!!! Fri Jun 10 2016 15:09:20 GMT+0800 (中国标准时间)
Vue对象的两种销毁方式
关于$destroy方法，引发的一个想法。如果把执行 $destroy 方法当做是 Vue对象的正常销毁，那如果把 Vue 对象先置空，再 delete 掉，是不是也可以完成Vue对象的销毁。结果证明是可以的。
<script>
// 监控
var army = {
solider: new Vue()
}
var vmWatch = new Vue({
data : army
});
vmWatch.$watch('solider', function(newVal, oldVal){
if(this.solider == null){
console.log('Delete');
this.solider = oldVal;
}
});
</script>
当我们对army.solider进行置空操作时，的确会被监控到，然后重新恢复 solider的值
army.solider = null
Delete
但是如果直接摧毁掉 army，整个对象就销毁了。
army = null
