vue判断字符串为空,vue包含字符串
本文主要介绍为什么不建议在vue中使用空字符串作为类名。通过实例代码详细介绍，具有一定的参考价值。感兴趣的朋友可以参考一下。
目录
比较空字符串“”和null情况1:使用空字符串“”情况2:使用null情况3:使用undefined以object的形式绑定类情况1: ISBOLD为false情况2: ISBOLD为null，空类一定是错的吗？当我们使用三元表达式来设置DOM元素的类时，使用空字符串将导致呈现一个没有值的空类。为了避免这种情况，我们可以使用null来代替空字符串。
！- -
div :class=isBold？粗体 :
！- div类-
！- -
div :class=isBold？ bold : null
！- div -
比较空字符串和null
继续分析上面两行代码。
情况1：使用空字符串
我们用boolean-exp来决定是否将元素绑定到class，isBold为真，就会绑定，就会返回bold否则，它将返回“”
div :class=isBold？bold : /div
data() {
返回{
isBold: false
}
}
此时，渲染结果如下
div类/div
！-空课堂-
如果isBold为true，渲染结果如下
div class=bold/div
情况2：使用null
用null看渲染结果。
div :class=isBold？ bold : null/div
data() {
返回{
isBold: false
}
}
渲染结果如下
分区/分区
！-很好。没时间了，同学们
如果isBold为false，渲染结果如下
div class=bold/div
情况3：使用undefined
Undefined与null具有相同的效果
div :class=isBold？ bold :未定义的/div
分区/分区
！-很好。没时间了，同学们
关于虚假价值
当isBold的值如下时，三元表达式也返回一个假值
错误的
不明确的
空
圆盘烤饼
0
或或` `(空字符串)
使用对象的形式绑定class
对象的形式更具可读性。
div :class={ bold: isBold }/div
但是三元表达式的最佳用途是在绑定复杂类时。
div :class=isActive？下划线粗体:null/div
使用 绑定class
我们再来看另一种情况。
div :class=isBold bold/div
它不仅是一个逻辑运算符，而且还可以返回值。就像上面的代码，如果isBold为真，它会返回bold，但是如果isBold为假呢？
案例1：isBold为false
div :class=isBold bold/div
此时，将返回一个空类
div类/div
案例2：isBold为null
div :class=isBold bold/div
为null时不会有空类。
分区/分区
案例3: ISBOLD未定义
div :class=isBold bold/div
未定义时不会有空类。
分区/分区
以上情况不是问题，只是用来做判断和返回值。
所以，如果想避免在使用时返回空类，最好使用null或者undefined。
但是我建议您使用对象或数组绑定的语法来设置类。
空class就一定不对吗？
在W#C的标准中，也可以使用空类。
！-没有错误-
div类./div
！-没有错误-
差异./div
HTML的语法不要求使用空属性。
但是为了代码的可读性，建议不要使用空属性，尤其是需要操纵DOM属性做判断的时候。
空属性很容易导致难以察觉的错误。
e.target.classList
e.className
img.src
.
但是.
不允许的空id属性。
！错误
向左滚动./div
！错误
div id= ./div
！-正确-
div id=name ./div
错误：ID不能是空字符串。
关于vue中为什么不推荐空字符串作为类名的这篇文章到此为止。更多相关的vue空字符串作为类名，请搜索我们之前的文章或者继续浏览下面的相关文章。希望大家以后能多多支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。