<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Vue中的条件渲染</title><!--引入vue.js库--><script src="../vue.js"></script>
</head><body>
<div id="app"><div v-if="flag">{{content}}</div><div v-show="flag">{{content}}</div>
</div><div>{{content}}</div><script>/*创建了一个vue实例*/var app = new Vue({el: '#app',data: {flag: falsecontent: 'hello world'}});
</script>
</body>
</html>v-if会销毁dom
v-show只是多一个style="display: none;，建议使用v-show
v-if、v-else-if、v-else不能分开，分开会报错
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Vue中的条件渲染</title><!--引入vue.js库--><script src="../vue.js"></script>
</head><body>
<div id="app"><div v-if="show === 'a'">this is A</div><div v-else-if="show === 'b'">this is B</div><div v-else="show === 'a'">this is other</div>
</div><script>/*创建了一个vue实例*/var vm = new Vue({el: '#app',data: {show: "a"}});
</script>
</body>
</html>给每个input添加一个key，不然会出现复用上一条数据的隐患
