第 6 课：v-if条件渲染

• 日期：2026-09-07
• 课程序号：第 6 课
• 知识点：v-if 与 DOM

用途

只在满足条件时创建提示内容。

核心概念

v-if 与 DOM用于保持示例中的数据或操作关系清晰；本课只处理这一项，不引入额外状态或自动化。

最小代码或操作示例

<button @click="done = !done">切换</button>\n<p v-if="done">已完成</p>

3～5 分钟练习

修改示例中的一个输入值，先预测结果，再在对应运行环境或软件副本中执行。

参考答案

v-if 为假时节点被移除；v-show 为假时节点仍存在但隐藏。

与上一课的联系

沿用上一课已经建立的最小示例，本课只增加这一项核心能力。

参考资料

• 官方文档：v-if条件渲染（2026-09-07 核对）。