Vue期末复习

1、创建一个Vue应用程序需要3个步骤:引入Vue.js库文件、创建一个Vue实例 、渲染Vue实例。

2、在Vue实例的配置中,el 用来选择页面上已存在的DOM元素作为Vue实例的挂载目标。

3、Vue实例的配置选项data用来声明需要响应式绑定的数值对象,data中定义若干个键值对,键值对之间用分号分隔。×

4、Vue实例的配置选项methods用来定义可以通过Vue实例访问的方法。√

5、mustache语法{{}}。

6、为输出html代码,使用v-html指令。

7、为是mastche语法作用在HTML属性上,使用v-bind语法,例如:class、style、value、href。

8、Vue的数据驱动是通过MVVM模式来实现。

9、v-model指令:实现在文本输入框上的双向数据绑定。

10、v-bind指令:绑定属性

11、Vue实例中进行数据异步修改优先使用watch配置属性。

12、beforeDestroy钩子函数在组件销毁前触发。

13、computed属性默认只有getter,但允许为其提供一个setter。

14、数组变异方法:push()、unshift()、splice()、pop()、shift()、sort()、resverse()。

15、非变异方法:filter()、concat()、slice()。

16、Vue.js中的插值分为文本、HTML代码、属性、JS表达式。

17、在MVVM架构下,View和Model是通过视图模式进行交互的。

fc3d960fb0f84b7d8e89a2a89e5ce644.png

18、用属性绑定的方法实现给input元素设置名字属性值为ip1,<input  :name='ip1'>

19、控制台中console.dir()命令用来显示一个对象所有的属性和方法。

20、方法console.time()和console.timeEnd()用来显示代码的运行时间。

21、控制台可以查看Vue实例属性data的语句是:console.dir(vm.$data),其中vm为Vue实例对象。

22、局部过滤器可以定义在Vue实例内部,用filters:{}属性定义一个或多个局部过滤器。

23、数据侦听watch中可以通过设置immediate属性为true来实现侦听开始后立即调用。√

24、console.table()用来输出漂亮的格式化后的数组或对象。√

25、生命周期函数的最后阶段是实例的销毁,会执行beforeDestroy和destroyed钩子函数。√

26、在Vue中使用key管理可复用元素。

27、v-show指令用于根据条件展示元素,从而实现元素的隐藏与显示。

28、v-for指令基于一个数组来渲染一个列表。

29、v-bind可以绑定class,也可以绑定style。

30、v-on指令主要用来监听DOM事件,并在触发时运行一些JavaScript代码。

47f19989a2b24322bdfcb9e172b27f83.png

31、通过v-model指令在表单的input、textarea、select元素上创建双向数据绑定;会忽略所有表单元素value、checked、selected属性的初始值,,总将Vue实例的数据作为数据来源。

32、v-pre指令:在模板中跳过Vue的编译,直接输出原始值。

33、v-cloak指令:保持在元素上直到关联实例结束编译。

34、v-once指令:只执行一次DOM渲染。

35、Vue.directive()方法定义的指令为全局自定义指令。

36、下列选项中表示监听单击事件语法糖定义正确的是@click='add'。

37、在Vue中使用key管理可复用元素。

38、v-show属性的值是布尔值。

1f72a2cd8bb0497fb9b825bed5132f8f.png

39、属性绑定:v-bind。

40、能够捕获事件的指令是v-on。

41、内置指令中能够隐藏未编译的元素的指令是v-cloak。

42、将输入域中内容转换为数值型数据的是v-model.number。

43、Vue.directive()方法定义的指令为全局自定义指令。

44、inserted钩子函数可以在被绑定元素插入父节点时调用。

45、自定义指令时,钩子函数的参数binding中,expression属性代表字符串形式的指令表达式。

46、v-show和v-if的不同之处有:(1)实现方式不同。(2)编译过程不同。(3)编译条件不同。(4)性能消耗不同。

47、v-on:click用语法糖可以简写成@click。

48、事件修饰符中, .self只会触发自己范围内的事件,不包含子元素。

49、表单中文本输入框可以用v-model指令将数据绑定到value属性。

50、指令与元素第一次绑定时调用的钩子函数是bind。

51、字面量分为字符串字面量(string literal)、数组字面量(array literal)和对象字面量(object literal),另外还有函数字面量(function literal)、模板字面量(多行文本字符串)。

52、.capture修饰符可以实现与事件冒泡的方向相反,事件捕获由外到内。√

53、v-pre能够实现标记内容原样输出。√

54、钩子unbind只调用一次,指令与元素解绑时调用。√

55、v-model.lazy修饰符:表示将输入域中内容转换为数值型数据。×【lazy 修饰符:使模型鄉定的数据只有在失去焦点或者是按下回车时才会更新。】

56、钩子unbind只调用一次,指令与元素解绑时调用。√

99c1d87b6f2e4ffc9c6ba4f5143ded1e.png

57、父组件向子组件传递数据,子组件可以使用以下props选项来获取数据。

58、子组件使用this.$emit('input',this.子组件属性)向父组件传值时,父组件中应该使用v-model指令来监听。

59、自定义事件中,子组件用$emit()来触发自定义事件,父组件使用$on()来监听子组件的事件。

60、props选项的对象类型可以用于对外部传递进来的参数进行数据验证。

16f7325d5ece47c4aa2c8f3b564bcc0d.png

61、没有命名、有且只有一个插槽称为默认插槽default或称为匿名插槽。

62、在子组件中,具名插槽是通过slot元素的name属性进行设置,在父组件中通过标记的slot属性或template标记的v-slot:slotname来实现。

63、Vue实例对象中,通过components选项来局部注册组件。

64、props的值的类型有两种:一种是字符串数组,一种是对象。

65、父组件也可以通过$children访问它所有的子组件中的数据。

66、父组件可以使用this.$refs(子组件索引)来获取或修改组件数据。

67、在向具名插槽提供内容的时候,也可以在一个template元素上使用v-slot指令。

68、在使用props对子组件传值时,如果不使用v-bind传递数字、布尔、数组、对象类型的数据,此时传递的数据都是字符串类型,由于模板中未使用v-bind指令绑定属性,不会被编译。√

8bf53788c5a84d388a4f43556db4a465.png

69、列表过渡可以使可以通过百分比的形式来规定动画的状态的是用的标记是<transition -group></transition -group >。

70、tag属性可以用来更换<transition-group>标记中的渲染元素。

71、可以通过百分比的形式来规定动画的状态的是@keyframes。

72、可以通过transition组件的钩子函数实现动画的是@enter。

73、动态组件需要通过Vue中的<component>元素绑定is属性来实现多组件的过渡。

74、动态渲染整个列表,需要使用v-for指令去遍历所有的列表项。

75、可以在<transition>组件上的设置duration prop定制一个显性的过渡持续时间。

76、在定义CSS动画时,需要通过@keyframes规则来创建动画,并在其中至少定义0%或者from和100%或者to两种样式。

71、单个元素/单组件过渡需要使用<transition>组件来封装过渡效果的元素或者组件,同时也可以设置name属性来设置过渡效果。

72、多个元素过渡时,可以设置transition组件的mode属性来设置过渡模式。其值有两个,分别为out-in、in-out。

73、动态组件中,在component内置组件中,需要使用v-bind指令来绑定is属性,并给该属性赋值才能实现多个组件过渡。

74、完成相关属性的设置,可以实现在<transition>组件上定制一个1000ms的过渡时间。<transition  :duration="1000">...</transition>

75、实现相反效果:reserve

76、Vue的过渡模式中,mode的属性值为in-out时,用来设置新元素先进行过渡,完成之后当前元素过渡离开。

77、不设置过渡组件的name属性和相应的类样式,同样可以让需要过渡的元素或者组件有过渡效果。×

78、可以通过before-enter属性设置节点在初始渲染的过渡。×

79、 使用多个v-if的多个元素的过渡可以重写为绑定了动态property的单个元素过渡。√

80、下列过渡类名中可以定义样式{opacity:0}的是v-enter、v-leave-to。

81、 下列过渡类名中可以设置样式{opacity:1}的类名是v-leave、v-enter-to。

82、使用下列选项中npm -v命令可以检查npm的安装版本信息。

83、加载(导入)其它模板可以使用方法是require()。

84、可以直接给exports赋值一个变量,如exports=function(){   }。×

85、package.json文件中用于描述包的依赖的属性是dependencies。

86、安装的依赖包的版本、名称、下载地址等信息在下列package-lock.json文件中。

87、Node.js是一个基于Chrome V8引擎的JavaScript运行环境,采用了单线程、非阻塞I/O、事件驱动式的程序设计模式。

88、Node.js非常适合于I/O密集型应用,如多人在线聊天、多人在线小游戏、实时新闻、博客、微博等。不适用于CPU密集型应用,如高性能计算、视频解码等业务。

89、webpack是一个模板打包器工具。

bcc7ded692ab4186821d40b73f64ef74.png

90、利用webpack打包过程中,通常单入口生成的文件名为bundle.js。

91、npm install style-loader,可以将模块的导出作为样式添加到DOM中。

92、全局安装vue-cli(或@vue/cli)是npm install vue-cli(或@vue/cli)--global;-g;。

93、 利用脚手架创建项目vue init <template-name> <project-name>中template-name指的是模板名称。

94、使用vue ui命令可以可视化地创建vue项目。

95、使用vue-cli@ 2.x命令行工具创建Vue项目myproject命令是vue init webapck myproject。

96、使用@vue/cli@3.x版本创建Vue项目myproject的命令是vue create myproject。

97、webpack默认只能识别JS模块,不识别其他模块。√

98、vue -v用于查看vue-cli的版本。×

99、webpack-dev-server是webpack官方提供的一个小型Express服务器。使用它可以为webpack打包生成的资源文件提供web服务。√

100、安装依赖包时,需要将依赖包信息写到package.json中的devDependencies中,可以使用命令是npm install --save-dev 依赖包名、npm install -D 依赖包名。

101、设置路由导航的组件是router-link组件。

102、当前路由对象中属性会保this.$route.path存当前路由的路径,总是解析为绝对路径。【fellpath绝对路径】

beb1e949452c4e3eb762bc0443f37578.png

103、在一个路由中设置多段“路径参数”,对应的值都会设置到$route.params中。

104、vue-router默认路由模式是hash(#)。

105、能够实现项目初始化,并创建package.json的命令是npm init -y。

106、在路由中定义别名,可以使用的属性alias。

107、在定义子路由时,通常不需要在子路由的path属性中添加"/",而是直接书写子组件名称。

108、使用import Router from 'vue-router',则使用Vue Router的正确语句是Vue.use(Router)。

109、设置路由导航时,使用to属性来传入路由(导航路径)。

110、每条路由route通常包含2个基本属性,分别是path、component属性,当然也可以设置name、children等。

111、重定向也是通过routes配置redirect属性来完成。

112、script标记中配置路由包含定义/导入路由组件、定义路由、创建路由实例和传入路由表参数等几个部分。

113、指令npm install vue vue-router –D和npm install vue vue-router --save-dev效果相同。√

114、Vuex的核心的是store。

115、Vuex中共享状态数据存储在下列state的核心对象中。

92bc5d9adb60434e8cce3f7176897948.png

116、安装vuex插件的命令是npm i vuex -D。

117、Vuex中能够触发mutation函数,从而修改状态,支持异步的对象是action。

118、mutations中的事件处理函数可以接受state作为参数,即初始数据。

3a0db48e6fb8490db79f3dbf4db61e37.png

738ba1488446416bbdc60e8d9bd8009d.png

119、定义一个Store的实例对象可使用的语句是const store=new Vuex.Store({ ...})。

120、 使用vue init webpack vuex-1方法创建项目后,必须在当前目录下安装vuex,并且将安装信息写入到开发依赖中的命令是npm install vuex -D;。

121、Vuex中的mutation非常类似于事件:每个mutation都有一个字符串的事件类型和一个回调函数(handler) 。

122、在Vuex配置选项中,其中actions是异步执行的。

123、在Vuex配置选项中,其中modules 选项用来在store实例中定义模块对象。

124、改变store中的状态的唯一途径就是显式地提交mutation。

125、Vuex为批量获取getters提供的辅助函数是mapGetters()。

126、Vuex应用的核心就是store(仓库)。store就是一个容器,它包含着用户应用中大部分的状态。

127、所有store中state的改变,都放置在store自身的mutation中去管理。√

用户不能直接改变store中的状态。改变store中的状态的唯一途径就是显式地提交 mutation。×

128、用户不能直接改变store中的状态。改变store中的状态的唯一途径就是显式地提交 mutation。√

129、 getter可以接受第一参数是state,也可将其他getter作为第二个参数。√

130、actions对象里的方法需要使用store.dispatch()调用。√

131、通过类似于模块化开发的方式可以实现对store对象仓库进行标准化管理。√

132、在项目的main.js文件中createApp(App).use(store).use(router).mount('#app')这种调用方式称为链式调用。

133、Vue 3.0中组件内部暴露出所有的属性和方法的统一API的选项是seup()。、

134、Vue 3.0中使用createRouter创建路由管理器。

135、Vue 3.0在setup函数中,使用下列从const router = useRouter()语句可以实例化路由。

136、Vue3.0中在实例挂载完毕时使用的钩子函数是onMounted 。

e0c779030ed148b3a31e7198190f7bca.png

137、Vue 3.0中用来创建响应式对象的函数是ref()、reactive()。

138、inject函数接收两个参数,两个参数分别是第一参数是要注入的property的name、第二个参数时默认值。

139、Vue3中的provide函数中的两个参数是第一参数是property的name(<string>类型)、第二个参数时property的value。

140、在Vue2.x中使用new Vue({})方式来创建实例,而在Vue 3.x中则使用createApp()创建组件实例(id为app)。

141、ref()函数接收一个参数值,返回一个响应式数据对象,该对象只包含一个指向内部的value属性。

a121c37001d145cd953f43038886181f.png

142、在Vue 3.0中可以使用ref引用DOM元素和组件实例。

143、需要将数据从父组件传递到子组件时,使用可以props。

144、通过命令vue add vue-next可以安装插件vue-cli-plugin-vue-next。

145、Vue3中的watch()函数可以用来懒惰地执行监听数据源,并且可以监视状态的先前值和当前值 。

81b29af370f74edea2bd5068822a69b4.png

146、钩子函数onBeforeMount作用于组件挂载前。

147、setup()函数的执行时间会在beforeMounted()之后mounted()之前被调用。×

148、watchEffect需要指定具体监听的属性。×

149、toRefs()可以将reactive()创建出来的响应式对象,转换为普通的对象。√

150、atchEffect需要指定具体监听的属性。×

151、子组件中不需要显式导入inject API,然后后代组件就可以共享父组件的数据。×

 

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值