VUE3中使用后台返回的枚举值使用时，不判断为空时刷新页面会报错

实际开发中遇到的坑

<div class="btn">
    <button :class="{quote:tableData.isClickQuotation,quoteGray:!tableData.isClickQuotation}" 

v-if="tableData.status.value==='Published'" :disabled="!tableData.isClickQuotation"  @click="clickBtn">
                    {{!tableData.isClickQuotation?"已报价":"立即报价"}}
    </button>
</div>

v-if="tableData.status.value==='Published'"中tableData.status是后台返回的是枚举，包含value和name,如果直接写成上面这段，不加判断，刷新页面会显示成空白页面，因为报错了 ，

报：Cannot read properties of undefined(reading 'value')，也就是---无法读取未定义的属性value,

但是光看控制台显示的错误位置又不对，继而先一个个检查value相关的，忽然看到tableData.status.value，一想估计是因为没有判断为空的原因，应该是加载页面html元素时，没有获取接口返回的值导致报错

2、解决方法就是判断是否为空，不为空取时value，也就是加个?

v-if="tableData.status?.value==='Published'"