条件渲染 - 根据用户选择显示 div答案

【问题标题】：Conditional rendering - show div based on user select条件渲染 - 根据用户选择显示 div
【发布时间】：2020-06-12 11:51:17
【问题描述】：

我有一个选择下拉菜单，并希望使用该值来决定是否通过v-if 显示 div。

<select class="custom-select custom-select-sm" id="lang">
  <option value="1">English</option>
  <option value="2">Svenska</option>
</select>

<a class="nav-link" v-if="???" href="#">People</a>

我该怎么做？

【问题讨论】：

这似乎是一个 Vue 特定问题 - 添加了标签。
这是一个非常基本的问题，虽然您可能很快就会得到答复，但我建议您仔细阅读 Vue 文档，以便真正学习。要实现这一点，您需要熟悉使用 v-model 进行模型绑定和使用 v-if 进行条件渲染。在你理解了这两件事之后——你就可以自己写代码了。
您遇到了什么问题？您应该发布您尝试过的内容

标签： css twitter-bootstrap vue.js conditional-rendering

【解决方案1】：

这是@Samuil 提到的基本 vue 功能：

new Vue({data:{lang:''}}).$mount('div')

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div>
<select class="custom-select custom-select-sm" id="lang" v-model="lang">
  <option></option>
  <option value="1">English</option>
  <option value="2">Svenska</option>
</select>
<a class="nav-link" v-if="lang" href="#">People</a>
</div>

【讨论】：