Vue.js基础与应用开发实战 测试习题及答案
单元1 在线测试
jquery在线库1．填空题
（1）Vue推崇编写以（）后缀命名的文件格式。
正确答案：*.vue
（2）Vue的数据驱动是通过（）模式来实现的。
正确答案：MVVM
（3）Vue是一套构建（）的渐进式框架。
正确答案：用户界面
（4）Vue的数据驱动是通过（）模式来实现。
正确答案：MVVM
（5）MVVM主要包含3个部分，分别是Model、View和（）。
正确答案：ViewModel
（6）Vue实例对象通过（）构造器来创建。
正确答案：Vue
（7）Vue初始数据在实例对象的（）参数中进行定义。
正确答案：data
（8）Vue实例对象中的el参数表示（）。
正确答案：唯一根标签
2．选择题
（1）下列选项中，代表视图部分的是（）。
A．Element B．DOM C．Model D．View
正确答案：D
（2）下列选项中，（）是基于Chrome V8引擎的JavaScript运行环境，它可以让JavaScript运行在服务器端。
A．npm.js B．jQuery.js C．vue.js D．Node.js
正确答案：D
（3）下列选项中，用于卸载指定包依赖的命令的是（）。
A．npm uninstall B．npm install C．npm update D．npm start
正确答案：A
（4）下列选项中，（）是基于Chrome浏览器的扩展，用于调试Vue应用的工具。
A．VS code B．vue-devtools C．Wechat D．Chrome
正确答案：B
（5）下列选项中，表示一个Node.js的包管理工具，用来解决Node.js代码部署问题的是（）。
A．webpack B．vue C．Node D．npm
正确答案：D
（6）Windows系统内置的命令行工具是（）。
A．npm B．cmder C．git-bash D．cmd
正确答案：D
（7）下列选项中，可以引入vue.js文件的是（）。
A．< a> B．< script> C．< style> D．< link>
正确答案：B
（8）下列选项中，主要用来实现网页结构的是（）。
A．php B．HTML C．CSS D．JavaScript
正确答案：B
（9）Node.js有两个版本，主要包括Current和（）。
A．MIN B．LTS（Long Term Support）
C．Vite D．LONG
正确答案：B
（10）下列选项中，用于开发和调试Web项目的工具的是浏览器和（）。A．服务器 B．选择器 C．计时器 D．vue-devtools
正确答案：D
（11）下列选项中，关于Vue说法错误的是（）。
A．Vue不可以用来构建单页应用
B．Vue通过虚拟DOM技术来减少对DOM的直接操作
C．Vue支持单向和双向数据绑定
D．Vue组件化的特性提高了开发效率、使代码更容易复用
正确答案：A
（12）在Vue实例中可以定义方法的是（）选项。
A.el
C.data
Dputed
正确答案：B
（13）在DOM文档渲染完毕之后调用的钩子函数是（）。A．beforeCreate B．created C．mounted D．destroyed
正确答案：C
（14）下列选项中，用来安装vue模块的正确命令是（）。
A．npm install vue B．node.js install vue
C．node install vue D．npm I vue
正确答案：A
（15）在Vue.js中，计算属性需要定义在（）选项中。
A．computed B．watch C．methods D．compute
正确答案：A
（16）下列关于Vue说法错误的是（）。
A．Vue与Angular都可以用来创建复杂的前端项目
B．Vue的优势主要包括轻量级、双向数据绑定
C．Vue在进行实例化之前，应确保已经引人了核心文件vue.js
D．Vue与React语法是完全相同的
正确答案：D
（17）下列关于Vue的优势的说法错误的是（）。
A．双向数据绑定 B．轻量级框架 C．增加代码的耦合度D．实现组件化正确答案：C
（18）下列不属于Vue开发所需工具的是（）。
A．Chrome浏览器 B．VS Code编辑器
C．vue-devtools D．开发者工具
正确答案：D
（19）npm包管理器是基于（）平台使用的。
A．Nodejs B．Vue C．Babel D．Angular
2
正确答案：A
（20）下列关于Vue实例对象说法错误的是（）。
A．Vue实例对象是通过new Vue( { } )方式创建的。
B．Vue实例对象只允许有唯一的一个根标签。
C．通过methods参数可以定义事件处理函数
D．Vue实例对象中data数据不具有响应特性
正确答案：D
（21）Vue实例对象中能够监听状态变化的函数是（）。
A．watch B．filters C．watching D．components
正确答案：A
（22）在实例被销毁之后调用的钩子函数是（）。A．beforeCreate B．beforeDestroy C．mounted D．destroyed 正确答案：D
（23）下列关于生命周期钩子函数的说法错误的是（）。A．beforeCreate钩子在Vue实例开始初始化时调用
B．created钩子在实例创建之后进行调用
C．mounted钩子在DOM文档渲染完毕之后进行调用
D．destroyed钩子在实例被销毁之前进行调用
正确答案：D
（24）vue的生命周期，执行顺序正确的是（）。A．beforeCreate→created→mounted→destoryed
B．mounted→beforeCreate→created→destoryed
C．beforeCreate→created→destoryed→mounted
D．init→beforeCreate→created→destroyed
正确答案：A
3
单元2 在线测试
1．填空题
（1）如果需要对一组元素进行判断，需要使用（）元素作为包装元素，并在该元素上使用v-if。
正确答案：<template>
（2）使用watch选项监听对象内部值的变化，可以在监听属性的选项参数中设置（）选项。
正确答案：deep
（3）Vue.js为v-on指令提供的事件修饰符中，使用（）修饰符可以阻止事件的
传播。
正确答案：.stop
（4）在Vue.js的指令中，修饰符是以（）符号指明的特殊后缀。
正确答案：半角小数点
（5）v-on指令的简写形式是在事件名称前添加符号（）。
正确答案：@
（6）在DOM中输出真正的HTML内容需要使用（）指令。
正确答案：v-html
（7）在Vue.js中，指令是带有（）前缀的特殊属性。
正确答案：v-
（8）如果需要频繁地切换DOM，需要使用v-show；如果在运行时条件很少改变，需要使用（）。
正确答案：v-if
（9）指令主要包括内置指令和（），以“v-”开头，作用于HTML元素。
正确答案：自定义指令
（10）以下代码中，当鼠标指向“显示”按钮时执行show方法，将代码补充完整。
<div id="app">
<button（）="show">显示</button>
</div>
正确答案：v-on:mouseover
（11）以下代码的运行结果是（）。
<div id="app">
<p v-if="a==1">真</p>
<p v-else>假</p>
</div>
<script type="text/javascript">
var demo = new Vue({
el : '#app',
data : {
a : 0
}
});
</script>
正确答案：假
（12）以下代码的输出结果为（）。
<div id="app">
<span>{{ LowerCase() }}</span>
</div>
<script type="text/javascript">
var vm = new Vue({
el : '#app',
data : {
str : 'BETTER'
}
});
</script>
正确答案：better
（13）以下代码中，应用v-for指令遍历数组items，将代码补充完整。<div id="app">
<span v-for="（）">
{{ item }}
</span>
</div>
<script type="text/javascript">
var demo = new Vue({
el : '#app',
data : {
items : ['a','b','c']
}
});
</script>
正确答案：item in items
（14）以下代码中，应用自定义指令设置文本的大小，将代码补充完整。<div id="app">
<span（）="'24px'">注册</span>
</div>
<script type="text/javascript">
var vm = new Vue({
el:'#app',
directives: {
setSize: function (el,binding) {
el.style.fontSize = binding.value;
}
}
})
</script>
正确答案：v-set-size
2
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论