车把中的 Vue 字符串匹配 {{myString !== "" ?我的字符串：其他字符串}}答案

【问题标题】：Vue string matching in handlebars {{myString !== "" ? myString : otherString}}车把中的 Vue 字符串匹配 {{myString !== "" ?我的字符串：其他字符串}}
【发布时间】：2019-04-14 02:46:51
【问题描述】：

{{myString !== "" ? myString : otherString}} 当前正在打印myString，这是一个空字符串

我的比较器有什么问题？我也尝试过使用单引号

我问这个看似基本的问题的原因是因为车把上的 Vue 文档似乎没有涵盖这一点，除了让我知道通用 javascript 可用之外，我认为这个比较器是用于字符串的通用 javascript

【问题讨论】：

我通过设置myString:"" 和otherString:"test" 尝试了您的示例，并在打印test 的模板中设置了{{myString !== "" ? myString : otherString}}，我认为您在其他地方有问题
myString.trim() !== "" 可能对输出有影响吗？ myString 是否可以为 null 或 undefined 而不是 ""？
@JonathanLonowski 是的，它可以。模型说 myString 应该是一个字符串，但 mongodb 对象可能没有那个键，目前
@JonathanLonowski 答案只是使用if(value)，因此{{ myString ? ... : ... }}

标签： javascript string vue.js comparator

【解决方案1】：

三元运算符在模板上运行良好。检查您的 myString 数据，它可能不为空。

  <div>Empty: {{myString === "" ? 'test' : otherString}}<div>
  <div>Non Empty: {{myString !== "" ? 'test' : otherString}}<div>

请参见下面的示例。

var app = new Vue({
  el: '#app',
  data() {
    return {
     myString: "",
     otherString: "blah"
    }
   },
})

<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>
<div id="app">
  <div>Empty: {{myString === "" ? 'test' : otherString}}<div>
  <div>Non Empty: {{myString !== "" ? 'test' : otherString}}<div>
  
</div>

【讨论】：

【解决方案2】：

if(value) 是这里的答案，涵盖了我需要的所有条件

所以{{ myString ? ... : ... }}

【讨论】：