vue3基础知识？vue前端面试题
各位老铁们，大家好，今天由我来为大家分享vue3基础知识，以及vue前端面试题的相关问题知识，希望对大家有所帮助。如果可以帮助到大家，还望关注收藏下本站，您的支持是我们最大的动力，谢谢大家了哈，下面我们开始吧！
vue3特性笔记
我们把vue3和 vue2的项目进行对比来去说明
综上所述，在 vue3的初始化项目中，与 vue2对比的最大差异其实就是两点：
setup函数也是 Composition API的入口函数，我们的变量、方法都是在该函数里定义的，不再使用vue2中的data而是setup。
reactive方法是用来创建一个响应式的数据对象，该API也很好地解决了Vue2通过 defineProperty实现数据响应式的缺陷
上面使用name必须state.name，不方便，另一个解决办法如下
执行 setup时，组件实例尚未被创建。因此，你只能访问以下 property： props attrs slots emit
换句话说，你将无法访问以下组件选项：
data computed methods
在Vue3中，这些生命周期部分有所变化，并且调用的方式也有所改变
Ts可指定类型，而不是以往所有对象参数都是object的any类型
另外Props可以提出来
h函数只是createVNode的简单封装，所以把h函数替换为createVNode也是一样的
ref就是通过 reactive包装了一个对象，然后是将值传给该对象中的 value属性，这也就解释了为什么每次访问时我们都需要加上.value。
我们可以简单地把 ref(obj)理解为这个样子 reactive({value: obj})
watch和 watchEffect都是用来监视某项数据变化从而执行指定的操作的，但用法上还是有所区别
watchEffect：
1、不需要手动传入依赖
2、每次初始化时会执行一次回调函数来自动获取依赖
3、无法获取到原值，只能得到变化后的值
vue3 基础概念 (含与 vue2.6 的对比)
计算属性是基于它们的响应式依赖进行缓存的。只在相关响应式依赖发生改变时它们才会重新求值。这就意味着只要 message还没有发生改变，多次访问 reversedMessage计算属性会立即返回之前的计算结果，而不必再次执行函数。
相比之下，每当触发重新渲染时，调用方法将总会再次执行函数。
通常更好的做法是使用计算属性而不是命令式的 watch回调。
Vue将被侦听的数组的变更方法进行了包裹，所以它们也将会触发视图更新。这些被包裹过的方法包括： push()、 pop()、 shift()、 unshift()、 splice()、 sort()、 reverse()
同时绑定多个事件
不同于组件和 prop，事件名不存在任何自动化的大小写转换。因为 HTML是大小写不敏感的，因此推荐你始终使用 kebab-case的事件名。
使用场景：由于 vue有$parent属性可以让子组件访问父组件。但孙组件想要访问祖先组件就比较困难。通过 provide/ inject可以轻松实现跨级访问祖先组件的数据。
provide：Object|()=> Object
inject：Array<string>|{ [key: string]: string| Symbol| Object}
提示： provide和 inject绑定并不是可响应的。然而，如果你传入了一个可监听的对象，那么其对象的属性还是可响应的。
动态组件：
异步组件：
混入 mixin提供了一种非常灵活的方式，来分发 Vue组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被“混合”进入该组件本身的选项。
将插槽内容传送至指定位置，接受一个 to的属性，它接受一个 css query selector作为参数，这就是代表要把这个组件渲染到哪个 dom元素中
Suspense组件用于在等待某个异步组件解析时显示后备内容。
AsyncShow.vue
index.vue
vue3教程
返回一个提供应用上下文的应用实例。应用实例挂载的整个组件树共享同一个上下文。
创建组件
或者是一个 setup函数，函数名称将作为组件名称来使用
创建一个异步加载组件
//高阶组件
在当前应用中查找组件，只能在 render或 setup函数中使用。
查找组件
在当前应用中查找指令，只能在 render或 setup函数中使用。
将回调推迟到下一个 DOM更新周期之后执行。在更改了一些数据以等待 DOM更新后立即使用它。
vue2.x的生命周期
vue3的生命周期
与 2.x版本生命周期相对应的组合式 API
新增的钩子函数
组合式 API还提供了以下调试钩子函数：
把一个响应式对象转换成普通对象，该普通对象的每个 property都是一个 ref
应用:当从合成函数返回响应式对象时，toRefs非常有用，这样消费组件就可以在不丢失响应式的情况下对返回的对象进行分解使用
问题: reactive对象取出的所有属性值都是非响应式的
解决:利用 toRefs可以将一个响应式 reactive对象的所有原始属性转换为响应式的 ref属性
利用ref函数获取组件中的标签元素
功能需求:让输入框自动获取焦点
文章到此结束，如果本次分享的vue3基础知识和vue前端面试题的问题解决了您的问题，那么我们由衷的感到高兴！