这是Vue.js模板

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

当用户使用数据时.phone==null或userdata.phone==未定义,我想显示空间.

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

可能吗?

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

用户数据.地点.城市、州、国家可以为空或未定义

推荐答案

拥有default fallback for values in regular Javascript和拥有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 || " ";
  }
}

如果你只针对支持nullish coalescing的浏览器,或者使用一个为你传输的构建步骤,那通常是更好的 Select .

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

Vue.js相关问答推荐

为什么我的数组在 onBeforeMount 函数中不为空,但在 onMounted 函数中为空

v-slot: activator 中 {attrs} 参数的作用是什么?

路径别名在 vue 脚本块中不起作用

在 VueJS 中为 Get、Post、Patch 配置全局标头的最佳方法

使用带有 v-date-picker 的 new Date() 不起作用

Vuetify 置顶工具栏

如何根据生产或开发模式读取不同的 .env 文件?

使用 vue-property-decorator 时注册本地组件

如何在 Node.js 服务器上部署 Vue.js 应用程序

ionic - `slot` 属性已被弃用 - eslint-plugin-vue

SassError:媒体查询表达式必须以(开头

在 Vuejs 中计算 DOM 元素之间距离的最佳方法是什么?

如何确定 Vue 何时完成更新 DOM?

在找不到图像源时设置替代图像

在 VUE JS 的光标位置插入字符

在 Vue JS 组件中使用 Laravel 路由的最佳方法是什么

无法访问函数内的数据属性

在子元素 vueJS.2 之间切换active类

使用 axios 和 vue.js 取消先前的请求

VS Code - 在 .vue 文件中启用 autoClosingTags 选项