Advertisement

Vue2与Vue3学习笔记

  •  5星
  •     浏览量: 0
  •     大小:None
  •      文件类型:PDF


简介:
《Vue2与Vue3学习笔记》是一份详细的记录文档,涵盖了从基础概念到高级特性的全面解析,旨在帮助开发者深入了解并掌握Vue.js的两个主要版本。 Vue2+Vue3 学习笔记 在 Vue 中,`mounted` 和 `updated` 是两个重要的生命周期钩子函数。当页面初次加载完成时调用的是 `mounted` 函数;而当数据发生变化并导致组件重新渲染之后触发的则是 `updated` 钩子。需要注意的是,如果只是修改了某个变量的数据值但未在视图中展示该变化,则不会触发出 `updated` 方法。 关于 Vue 中的 `data` 属性有两种定义方式:函数式和对象形式。采用函数式的数据定义方法时,对一个实例中的属性进行更改并不会影响到另一个使用相同配置的对象;而如果选择以对象的形式来设置 data ,那么修改其中一个实例的数据将会影响所有基于该模板创建出来的其他实例。 通过 `Vue.extend` 方法可以用来生成新的 Vue 组件类。每当执行一次此操作都会返回一个新的组件构造器,即使我们重复调用相同的参数也是如此。 在 Vue 中使用任何标签都可以添加一个名为 `ref` 的属性来标识这个特定的元素或组件,并且可以在其他地方便捷地引用它。 props 是一种用于父级向子级传递数据的方式。这种方式使得复用同一组件成为可能,因为不同的实例可以接收并展示不同的数据集。但是需要注意的是,在 script 标签里使用 `this.变量名` 引用 props 接收的数据时,如果尝试修改其值会触发控制台警告。 scope 属性允许我们在容器标签或样式中添加特定的标识符,并根据这些标识符来应用相应的 CSS 规则或者 JavaScript 逻辑。 组件之间的通信可以通过多种方式进行。例如:父级向子级传递数据可以使用 props;而从子级到父级的数据传递通常通过自定义事件实现;对于任意两个不具有直接父子关系的组件,我们可以采用全局事件总线或发布订阅模式来完成信息交换。 插槽是一种允许父组件将自身的结构插入到子组件内部指定位置的技术。其中作用域插槽更进一步地支持了从子向父传递数据的需求,并且要求使用 `