对Vue的理解
-前端三大主流框架之一，是MVVM框架，通过VM实现数据双向绑定，他帮助我们操作dom
渐进式：用什么拿什么
特点：组件化，数据驱动
说说Vue2和Vue3的区别
- Vue2是options选项式Api,Vue3是Composition组合式Api，它的入口是setup()函数，vue实例创建前被调用，所以没有this,没有this导致用2里用this的写法，有点区别，比如组件传值，用setup里的两个参数，props和context传，然后响应式监听有ref和reactive这两种写法，他俩区别是，
- ref只能包装基本数据类型，只能对单独数据进行包装，还得用.value
- reactive可以包装多个数据，比如对象，数组
- 场景：ref做不了的就用reactive
- 双向绑定原理不太一样，Vue2里是通过ES5里的一个API,Object.defineProperty()方法实现的
Vue3是通过ES6的ProxyAPI对数据代理，优势是可以监听对象，也可以监听数组
Vue3常用的Api
createApp(),app.mount()
setup(),ref(),reactive()
生命周期:onMounted(),onUpdated(),onUnmounted()
Vue3中的ref和reactive有什么不同？
ref包装单个的值，reactive包装对象
谈谈双向绑定的原理和使用场景
通过vue实例的响应式系统来实现的。
他将组件中使用到的数据对象转化成响应式的对象，当这些数据发生改变时，会触发对应的视图重新渲染，实现了数据双向绑定
场景：表单的处理，实现表单元素与后台数据库之间的交互，比如Input,textarea
组件通信：让父子组件可以共享状态，同时自动更新视图
谈谈虚拟DOM
- 在Vue中，组件数据发生改变时，首先会加载虚拟DOM,虚拟和真实DOM进行对比，不一样的节点才会重新渲染，提高了渲染效率
v-if和v-show
- 相同：都是控制是否渲染元素的标签
不同： - v-if通过真假，来判断dom的添加或者删除
- v-show只是修改了css样式，通过dsiplay属性来渲染（频繁切换场景）
Vue常用的几种指令
v-if v-show v-for v-on v-bind v-model v-once
Vue中$mount和el区别
都是把vm挂载到指定dom元素中
如果指定了el，则会就会渲染到el对应的dom中
没有指定el，vm就未挂载，此时通过$mount来手动挂载
什么是计算属性，怎么用的,和watch有啥区别
- computed计算属性，监听vue中数据的变化，数据改变的时候会触发
- watch监听属性，只有当要监听的数据发生变化时才会触发
说一下Vue组件之间参数传递
- 父传子：props方法
- 子传父：this.$emit(自定义事件名,参数)
路由两种模式：
- hash：优点是兼容性高。缺点是URL带有#号不好看
- history：优点是URL不带#号，好看。缺点是既需要浏览器支持也需要后端服务器支持
路由传值
两种方式：
1.params:类似于post方式，参数不会显示，利用路由规则中name跳转
2.query:类似于get方式，参数会显示，利用规则中的path跳转
脚手架常用命令
- vue create项目名字
- npm run serve
- npm install axios
v-for和v-if哪个优先级高
- 先处理v-for,再处理v-if
路由之间如何进行跳转
- 用<router-link:to="xxx">标签进行跳转
- js跳转 router.push('index')
什么是路由？
- 因为是Vue这种SPA，单页面应用，浏览器其实不会主动去跳转和刷新的，页面内容的更新是通过vue-router实现的
vue常用的路由对象
- $route.name 当前路由的名称
- $route.path当前路由对象的路径
- $route.query查询的键值对
- $route.params预设的变量，切换时候通过parmas带过去某个id的值
脚手架项目里怎么用自定义组件
1.在components里新建组件文件
2.需要用到的组件import导入
3.注入到子组件components属性上面
4.在视图层使用
用没用过vuex，什么场景用，vuex中store是啥
- vuex是vue的状态管理器，就是一个仓库，仓库里放了很多对象，数据存放在state里，vue组件从store中读取数据，如果store中的数据发生改变，依赖数据相应的组件也会发生改变
- 他就是把一些数据在各个组件中进行共享
- 比如说登录状态
vue生命周期
- 页面第一次加载会触发(创建的四个钩子)：beforeCreate,created,beforeMount,mouted这几个钩子
vue3对最后的两个生命周期做了一些变化，官方的解释是和mounted做一些对应，换了个名，本质没啥区别，因为vue3新增了一个特性，他的api叫composition
他把beforecreate和created替换成了所谓的setup
breforeCreate:组件vm刚在内存中被创建出来，还没初始化data和methods(loading事件)
created:实例创建完毕，data和methods创建完毕 ，还没开始编译模板
(在日常的开发中，当created被回调的时候，vue实例里面的data，methods都已经初始化完成了，所以我们可以进行数据的初始化，调用方法，发送请求，大多数的事情都可以做了，但是我们不能操作dom，因为这时候是虚拟dom,真实的dom还没有生成，vue就是把虚拟的节点渲染为真实的节点，那么这部分的工作就可以在mounted里面做)
breforeMount:这时候完成了模板的编译，还没挂载
mounted:完成挂载，这时候将编译好的模板挂载到了页面指定的容器中显示(挂载元素，获取DOM节点)
一定要等到html渲染完成才可以进行，这时候就需要用到mounted
beforeUpdate:组件数据更新之前，还没开始重新渲染dom节点
（数据修改后，视图改变前）
updated:组件数据更新完毕，页面渲染好了(对数据统一处理)
（数据修改后，视图变化后）
view的数据变化到视图改变是存在一定时间的
vue提供了一个api叫做nexttic方法，在数据改变前触发这个方法，然后在该方法的回调方法里面拿到视图更改后的一个dom逻辑
beforeDestory/beforeUnmount::组件实例销毁之前(关闭定时器)
destroyed/unmounted:组件实例销毁完毕，所有东西都会解除绑定，事件监听器会被移除，子实例也会被销毁 - 加入keep-alive(缓存组件的)还会多两个生命周期
activated(进入)、dactivated(离开/销毁) - 父子组件引入子组件会执行哪些生命周期？
父:前三个，子:前四个，父:第四个 - 优先加载子组件数据，那么父组件中的请求要放在mounted里
前后端数据怎么交互的？
- Axios封装了Ajax的库，也可以对请求进行异步处理
- Axios是基于promise的，promise是ES6中给我们提供好的异步对象，这异步对象底层就是原生的AJAX
- 原生AJAX流程:
1.创建XMLHttpResquest对象
2.通过这个对象的open()和send()方法，向服务器发送请求
3.然后服务器端会响应结果，会获得JSON格式的字符串，用responseText接收
4。readyState和状态码，4和200说明，返回成功 - 同步：我们客户端向服务器端 发送请求，得等服务器响应结果
- 异步：我们客户端向服务器端 发送请求，不用等待服务器端立即给我响应，这个时候我 还会做其他事情，比如说注册邮箱
- 使用Axios之前需要导入库
- axios封装了自己的回调方法：.then()是请求成功后的回调方法，.catch()是请求异常后的回调方法，回调方法必须用箭头函数，获取全局对象，才能对vue中的变量进行数据绑定
- Axios封装了get和post方法，可以分别发起一个get请求和post请求
el属性和$mount优先级
el优先级高
var和let作用域
- var只有全局作用域和函数作用域，所谓全局作用域就是在代码的任何位置都能访问var声明的变量，而函数作用域在变量声明的当前函数内部访问变量。函数外部是无法访问函数内部声明的变量的
- let是块作用域，所谓块作用就是控制流程语句的有效范围。如果我们控制流程语句中使用let定义一个变量，那么我们在控制流程语句外是无法访问这个变量的。
router和route区别
router是最大的路由对象，是路由管理对象（路由跳转）
route是某一条路由，是路由单体对象（this.$route.xxx）获取当前路径所在这个路由对象（跟当前路径有关的）
路由传参两种方式和区别
query传参；类似于get(参数会在路由中显示)利用路由规则中的path进行跳转,刷新页面之后参数还在
params类似于post，利用路由规则中的name进行跳转
Ajax的理解
- Ajax为异步请求，实现局部刷新，动态修改参数
- Ajax核心封装类是XMLHttpRequest,用它的open方法创建请求，用send方法发送请求，当readyState=4,证明数据处理完毕,相应码200成功
- 数据的获取用的是responseTest
对插槽的理解
使用场景：比如布局组件、表格列、下拉选、弹框显示内容等
路由懒加载？
路由被访问时候才加载对应的组件
在components中，用箭头函数import这种写法