1、 注册组件几种方式,有何区别,且如何注册
2种方式,全局注册和局部注册;全局所有地方可以使用,局部只有当前.vue中可以使用
方式1:
Vue.compoent('组件名',组件对象)
方式2:
components:{
组件名:组件对象
}
2、组件使用三个核心要素是?
导入、注册、使用
3、一个.vue文件由几部分组成,分别什么含义?
template 模板
script 脚本
style 样式
4、如何让组件的样式只有局部效果
给style标签加上scoped属性
5、请简述如何实现父子通信,且用伪代码演示核心步骤
1.简述:父子通信主要是通过自定义属性props属性
2.演示:
子组件定义props ===> props:['属性名']
子组件使用props ===> {{属性名}}
父组件传递数据 <子组件 属性名="数据" />
6、请简述如何实现子父通信,且用伪代码演示核心步骤
1.简述:子父通信主要通过$emit实现
2.演示:
子组件里发自定义事件 ===> this.$emit('自定义事件名','实参
父件里组件标签上面自定义事件绑定事件 ===> <子组件 @自定义事件="事件函数"/>
父组件定义事件函数 methods:{ 事件函数(形参){} }
7、组件通信有哪些方式
1. 父子通信自定义属性props
2. 子父通信自定义事件$emit
3. 兄弟通信事件主线, $on和$emit
4. $refs获取子组件实例对象
5. $parent获取父组件实例对象
6. 本地存储
=== 答对上面即可
7. vuex
8. provide/inject
9. $attrs 和 $listen
8、vue生命周期分为几个阶段,几个钩子函数,分别写出来
四个阶段,8个钩子
beforeCreate 创建前
created 创建后
beforeMount 挂载前
mounted 挂载后
beforeUpdate 更新前
updated 更新后
beforeDestroy 销毁前
destroyed 销毁后
9、页面一打开执行哪些钩子
beforeCreate 创建前
created 创建后
beforeMount 挂载前
mounted 挂载后
10、页面进来要做的事,页面关闭要做的事在哪些钩子里
created 创建后
beforeDestroy 销毁前
11、axios有哪些常用方法,这些方法返回的是什么
1.返回Promise
2.常用方法
axios()
axios.get()
axios.post/put/delete/patch()
答出 axios() axios.get() axios.post() 即可
12、请分别写出axios 的 get请求和post发请求都携带数据的伪代码
axios({
url:"/地址",
method:"get/post",
params:{get提交数据},
data:{ post提交数据}
})
用上述综合方法描述也可以,或者单独
axios.get('/地址',{ params:{ get提交的数据 } })
axios.post('/地址',{post提交的数据})
13、如何实现在任何组件中都可以读取到axios
在main.js中将axios挂载到Vue的原型上面
import axios from 'axios'
Vue.prototype.$axios = axios
组件中使用 this.$axios
14、请输出ref的作用,并且使用伪代码描述其使用
1.作用: 获取DOM或者组件实例对象
2.使用:
<组件或标签 ref="名称" />
this.$refs.名称
15、请说出$nextTick的作用,为什么使用他?
1. 作用: $nexTick 等到DOM渲染完成之后执行
2. 原因: 页面渲染是异步的,我们不能直接在赋值之后读取最新DOM内容
16、动态组件作用?如何使用?
1. 作用: 动态切换展示不同组件内容
2. 使用: <component :is="变量" />
17、如何实现组件缓存? 需要注意什么? 如何解决?
1. 实现
<keep-alive>
<组件/>
</keep-alive>
2. 注意: 一旦组件被缓存,将不会被再次创建,前四个钩子不再执行
3. 使用新提供的2个钩子, 打开的时候执行activated ,关闭执行deactivated
18、请说明插槽作用,并用伪代码实现具名插槽
1. 作用: 用来实现自定义组件内部模板的内容
2. 实现:
组件内部:
<slot></slot>
<slot name="aa"></slot>
<slot name="bb"></slot>
组件标签之间:
<组件>
<标签/>
<标签 slot="aa"/>
<标签 slot="bb"/>
</组件>
19、自定义指令作用是什么?如何注册?
1. 作用: 操作DOM
2. 注册:
Vue.directive('指令名',{
inserted(el,binding){
el
binding.value
}
})
20、列表功能实现的思路是什么?
1. data定义变量
2. methods定义方法(发送请求、加工数据、赋值变量)
3. created调用方法
4. 渲染数据