代码之家 › 专栏 › 技术社区 › Giesburts

检查是否为vue.js中的属性提供了值

vuejs2 vue.js javascript

Giesburts · 技术社区 · 6 年前

我正在开发一个组件,我想在其中显示基于数据属性的徽章。为了向组件提供数据,我使用了一个道具。这个道具叫做 status 如果出现的话 0 或 1 是的。

现在我想检查这个值是否被显示,如果是,我想在组件中呈现一些html。最好的方法是什么?如果没有提供数据/值,我不想呈现HTML。

HTML格式

<span>
    <div class="circle-small" :class="{ 'validated': tab.status }"></div>
</span>

因此,我想呈现这个HTML只有当数据到道具'状态'是提供的。我试着用 v-if="tab.status" 但是通过这样做,当 地位 是 0个 是的。

使用 required 像这样的道具上的财产

status: {
    Type: Boolean,
    required: true,
},

也不会起作用,因为它实际上不需要使用这个道具。

支柱

status: {
    Type: Boolean,
},

有人有好的解决方案吗?

1 回复 | 直到 6 年前

Julian Paolo Dayag 6 年前

将默认值设置为 null 以下内容:

status: {
    Type: Boolean,
    default: null
},

然后您可以检查它是否像这样通过:

status !== null

这意味着道具 status 没有通过。

推荐文章

Softly · 单选按钮未按预期取值

1 年前

Jason Owens · 我的html/javascript播放按钮无法播放嵌入的youtube视频

1 年前

SlickRed · 我无法使用JS关注HTML元素

1 年前

Mayron Guedes · 如果登录名不在本地存储中,如何重定向页面?

1 年前

assembler · Nextjs没有处理发布请求

1 年前

PavelB · 如何使用Seleniumwebdriver和mocha只运行一个测试文件?

1 年前

BADRUM · 执行两个获取功能后,如何导航回页面?

1 年前

Toniq · javascript为php保存多维数组

1 年前

Natalie Smyth · 隐藏类只在我试图切换的两个部分中的一个部分上工作

1 年前

SkyWalker · 在JavaScript中,合并日期-时间序列的有效算法是什么?

1 年前