weixin_62986811的博客

在Vue2中，使用组件需要先引入，再components中定义再使用，Vue3中，只要是在中引入的子组件就可以直接使用。在Vue3中，组件传值有一点小小的变化，子组件接收父组件传来的值时，需要使用definePops 这个方法，在v-for中使用模板引用时，对应的ref是一个数组，它将在元素循环后包含整个循环的所有元素。在实际应用中，我们可能在父组件中的可能是一个数组，这时候我们结合v-for循环做渲染。这里用到defineEmits宏，定义一个值存放。

每个 Vue 组件实例在创建时都需要经历一系列的初始化步骤，比如设置好数据侦听，编译模板，挂载实例到 DOM，以及在数据改变时更新 DOM。在此过程中，它也会运行被称为生命周期钩子的函数，让开发者有机会在特定阶段运行自己的代码。beforeDestroy -> onBeforeUnmount 组件挂载到节点上之前执行的函数。beforeMount -> onBeforeMount 组件挂载到节点上之前执行的函数。beforeUpdate -> onBeforeUpdate 组件更新之前执行的函数。

1.v-on指令，简写为@来监听Dom事件，并且在触发时执行对应的JS，例如点击事件可以是。v-bind：class可以缩写为：class，它的作用是动态传输样式，我们可以传递一个对象来动态的切换class。2.v-for和v-if同时使用时会抛出警告，原因时v-for定义的值没有在改实例定义，解决办法是将v-for放在。v-if指令可以选择性的渲染一块区域的内容,可以搭配v-else使用，当v-if的值=fales的时候，就会显示。简单许多，元素无论初始条件如何，始终会被渲染，只有 CSS。

Vue3响应式，用到来简化该操作，具体代码如下。重点：需要在script里引入reactive。如此就省略了return暴露这一步，简洁明了。数据定义在steup（）方法中。