v-if报undefined

vue项目使用v-if的判断值取不到报undefined错误。

代码演示：

定义一个变量，值在sessionStorage不存在；

data() {
      return {
        bcid:sessionStorage.getItem("bcid"),
      };
    },

然后在标签中使用if；

<div v-if="bcid!='12345678'" :key="bcid">
   该工坊未发布服务!
</div>

这样就会报出undefined；

 

原因： 

因为v-if里 undefined 和 "" 空值的判定都是  false

而我们在js中if(undefined)是false，if("") 是true；所以页面中的v-if判断为空，最好使用v-if=‘!变量’。

正确代码：

<div v-if="!bcid || bcid!='12345678'" :key="bcid">
   该工坊未发布服务!
</div>