javascript - 如何在vue.js模板中显示空间而不是未定义和null？

这是Vue.js模板

<strong>{{userdata.phone}}</strong>

当userdata.phone == null或userdata.phone == undefined时，我想显示空格。
例如

<strong> {{ userdata.phone | !null | !undefined }} </strong>

是否可以？
在这种情况下，该怎么办？

<strong>{{userdata.location.city + userdata.location.state + userdata.location.country }}</strong>

userdata.locationi.city，state，country可以为null或未定义

最佳答案

解决方案与使用default fallback for values in regular Javascript相同。

<strong>{{ userdata.phone || " " }}</strong>

相同的解决方案适用于多个后备。

<strong>{{ userdata.location.city || userdata.location.state || userdata.location.country || " " }}</strong>

另外，如果涉及到更复杂的逻辑或当您想重用它时，为此使用computed property可能会很方便:

computed: {
  phone: function () {
    return this.userdata.phone || " ";
  }
}

关于javascript - 如何在vue.js模板中显示空间而不是未定义和null？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/46191486/