小编Shu*_*yal的帖子

如何在 vue.js 的 v-model 中正确应用三元运算符?

我正在尝试在 v-model 中应用三元运算符,但它不起作用。我还在stackoverflow上阅读了很多类似的问题和答案,但没有人回答我的问题。

我创建了一个数据变量testCondition,它默认设置为 false。利用这个条件testCondition?name:place地方则返回V模型如果testCondition是假的,但如果testCondition为真,则V模型不返回任何东西。

这是我的代码:

new Vue({
  el: "#app",
  data: {
    name: '',
    place: '',
    testCondition: false,
  },
})
Run Code Online (Sandbox Code Playgroud)
body {
  padding: 15px;
}

input {
  border-radius: 3px;
  padding: 5px;
  border: thin solid lightgrey;
}
Run Code Online (Sandbox Code Playgroud)
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
  <br>
  <input type="text" v-model="testCondition?name:place">
  <br><br> Test condition status: {{testCondition}}
  <br> Name: {{name}}
  <br> Place: {{place}}
</div>
Run Code Online (Sandbox Code Playgroud)

预期结果:如果我将testCondition的值从false更改为true,则输出应显示在 {{name}} 中

实际结果:如果testCondition设置为false,则仅适用于 …

javascript vue.js vuejs2

4
推荐指数
2
解决办法
2万
查看次数

标签 统计

javascript ×1

vue.js ×1

vuejs2 ×1