v-bind后面的是js语法 这里的[ ]加和不加有什么区别

来源:3-11 Vue中的样式绑定

慕仰7463641

2020-12-11 16:45:42

# 具体遇到的问题
v-bind后面的是js语法 这里的[ ]加和不加有什么区别
# 报错信息的截图

 <div  @click="handleDivClick"

            v-bind:class="[activated]"

        >


# 相关课程内容截图
http://img.mukewang.com/climg/5fd331ab099a503004940227.jpg# 尝试过的解决思路和结果

# 粘贴全部相关代码,切记添加代码注释(请勿截图)

在这里输入代码,可通过选择【代码语言】突出显示

写回答

1回答

好帮手慕慕子

2020-12-11

同学你好, 针对你的问题解答如下:

1、截图中的代码加不加[]实现的效果都是一样的,示例:

http://img.mukewang.com/climg/5fd33def092b387908070410.jpg

两种方式都给div添加了类名active

http://img.mukewang.com/climg/5fd33e05098acf5905140135.jpg

2、两者的区别体现在添加多个类名上:

(1)加[]可以绑定多个类名,每个类名之间使用逗号分隔

(2)不加[]时,只能添加一个类名,写在后面的会被忽略。

示例:

http://img.mukewang.com/climg/5fd33ea509f889b607410425.jpg

第一个元素添加了两个类名,第二个元素只添加了一个类名

http://img.mukewang.com/climg/5fd33eb80957c9ec07030206.jpg


​祝学习愉快~

0

0 学习 · 10739 问题

查看课程