首页/ 学科题库/ vue/ 模板语法与数据绑定专题测试

vue 模拟试卷

模板语法与数据绑定专题测试

11 题 40 分钟难度：★

插值表达式与文本渲染
v-bind、v-model 等核心指令
单向绑定与双向绑定
计算属性与过滤器

试卷习题（11 题）

参考答案在文末

判断题

1

判断题

Vue的插值表达式{{ }}中只能使用简单的变量名，不能使用JavaScript表达式。

A

对

B

错

2

判断题

v-if和v-show都能控制元素的显示与隐藏，它们的区别是v-if会真正地销毁和重建DOM元素。

A

对

B

错

单选题

3

单选题

在Vue模板中，用于显示数据的双大括号语法是什么？

A

{{ message }}

B

<% message %>

C

${ message }

D

#{ message }

4

单选题

以下哪个指令用于绑定HTML元素的属性？

A

v-model

B

v-bind

C

v-on

D

v-html

5

单选题

v-model指令本质上是什么的语法糖？

A

v-bind:value和v-on:input

B

v-bind:change和v-on:change

C

v-bind:data和v-on:update

D

v-bind:checked和v-on:click

6

单选题

以下哪个是v-on指令的简写形式？

A

:

B

@

C

D

~

7

单选题

使用v-for遍历数组时，如何同时获取元素和索引？

A

v-for="(item, index) in items"

B

v-for="item, index in items"

C

v-for="items as (item, index)"

D

v-for="{item, index} in items"

8

单选题

v-show指令是如何实现元素显示与隐藏的？

A

通过CSS的display属性

B

通过CSS的visibility属性

C

通过CSS的opacity属性

D

通过从DOM中移除元素

多选题

9

多选题

关于v-bind绑定class和style，以下哪些说法是正确的？

A

可以通过对象语法绑定class，如{ active: isActive }

B

可以通过数组语法绑定class，如[activeClass, errorClass]

C

style绑定只支持对象语法

D

可以在绑定的对象中使用多个属性值

10

多选题

关于v-html和v-text指令，以下哪些说法是正确的？

A

v-html会将数据作为HTML解析并渲染

B

v-text会将数据作为纯文本渲染

C

v-html可能会带来XSS安全风险

D

v-text可以渲染HTML标签

填空题

11

填空题

Vue中用于条件渲染的指令有和,用于循环渲染列表的指令是。

参考答案

1.错误 2.正确 3.A 4.B 5.A 6.B 7.A 8.A 9.A;B;D 10.A;B;C 11.v-if;v-show;v-for

想在手机上在线作答这套卷子？

使用微信 卷王开发者小程序/App，首页顶部扫一扫识别二维码，即可限时作答并自动判分。

了解产品 App