05_条件渲染
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>08_条件渲染</title> </head> <body> <!-- 1. 条件渲染指令 v-if v-else v-show 2. 比较v-if与v-show 如果需要频繁切换 v-show 较好 --> <div id="demo"> <p v-if="ok">表白成功</p> <p v-else>表白失败</p> <hr> <p v-show="ok">求婚成功</p> <p v-show="!ok">求婚失败</p> <button @click="ok=!ok">切换</button> </div> <script type="text/javascript" src="../js/vue.js"></script> <script type="text/javascript"> new Vue({ el: '#demo', data: { ok: true, } }) </script> </body> </html>