if 條件渲染不會在虛拟 DOM 中建構，也不會渲染到真實 DOM 中；show 雖然不會顯示在頁面中，但是會在虛拟 DOM 中建構，也會渲染到真實 DOM 中。
在有些情況下，我們需要根據實際的業務來控制标簽是否渲染到真實 DOM 中。是以，條件渲染就派上用場了，它分為<code>if...elif/else</code>和<code>show</code>兩種。
show 允許标簽渲染到真實 DOM 中，隻是利用了 CSS 樣式 <code>display: none;</code> 來控制是否顯示；
如果 if 的條件滿足，就把标簽渲染到真實 DOM 中。
在編輯器左上方的工具欄，找到 View -> Tool Windows，點選 Previewer。
在 Previewer 的上方有一個圖示
。
點選它之後可以顯示一個工具面闆 inspector，它的作用與浏覽器 F12 差不多，可以直接了解 DOM 渲染的情況。
如下圖，elif 條件<code>flag == 'bar'</code>，是以隻将第二個 text 标簽渲染到真實 DOM 中。
如下圖，show 把所有的标簽都渲染到真實 DOM 中了，其餘沒有顯示的标簽隻是因為其樣式為<code>display: none;</code>。
！注意：禁止在同一個标簽上同時設定 for 和 if 屬性。