随笔分类 - Vue
摘要：1、 Options API 存在的问题 —— 配置式的API 使用传统 vue2 中的 Options API ，新增或者修改一个需求，就需要分别在 data 、methods、computed 里修改。 2、Composition API 的优势 —— 组合式的API 我们可以更加优雅的组织我们
阅读全文
摘要：前言 Vue 框架通过数据双向绑定和虚拟 DOM 技术，帮我们处理了前端开发中最脏最累的 DOM 操作部分， 我们不再需要去考虑如何操作 DOM 以及如何最高效地操作 DOM；但 Vue 项目中仍然存在项目首屏优化、Webpack 编译配置优化等问题，所以我们仍然需要去关注 Vue 项目性能方面的优
阅读全文
摘要：什么是虚拟DOM ? ⽤ JavaScript 对象表示 DOM 信息和结构，更新后使之与真实dom保持同步，同步过程就是协调，核心是diff算法。 DOM 定义了一个接口,该接口允许JavaScript之类的语言访问和操作HTML文档。元素由树中的节点表示，并且接口允许我们操纵它们。但是此接口需要
阅读全文
摘要：MVC,MVP,MVVM是三种常见的架构模式,它通过分离关注点来改进代码组织方式。不同于设计模式(Design Pattern),只是为了解决一类问题而总结出的抽象方法，一种架构模式往往能使用多种设计模式。 MVC模式是MVP,MVVM模式的基础，这两种模式更像是MVC模式的优化改良版,他们三个的
阅读全文
摘要：我们能够知道，一般情况下，组件进行切换的时候，默认会进行销毁，这里我们定义 Home 和 About 两个组件，每个组件都放置一个输入框，并使用钩子函数 created 和 destoryed 来显示每个组件的创建和销毁： 一开始进入页面时组件 Home 创建： 进入组件 About 时，About
阅读全文
摘要：前言 “导航”表示路由正在发生变化。 vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航。有多种机会植入路由导航过程中：全局的, 单个路由独享的, 或者组件级的。 这里主要讲解一下全局守卫的 beferEach 和 afterEach,其它的导航守卫可以查看官方文档：Vue R
阅读全文
摘要：前言 对于 Vue 这类渐进式前端开发框架，为了构建 SPA（单页面应用），需要引入前端路由，这也就是 Vue-Router 存在的意义。vue 的单页面应用是基于路由和组件的，路由用于设定访问路径，并将路径和组件映射起来。传统的页面应用是用一些超链接来实现页面切换和跳转的。在vue-router单
阅读全文
摘要：路由传参的方式主要有两种：params 和 query. 接下来我们先定义两个路由 ‘/home’ 和 ‘/profile’ 来分别看看这两种传参方式各自的用法和区别，下面的测试都是从路由 ‘/home’ 跳转到 ‘/profile’ ，参数也是从 ‘/home’ 传到 ‘/profile’ 。 {
阅读全文
摘要：前言 组件是 vue.js最强大的功能之一，而组件实例的作用域是相互独立的，这就意味着不同组件之间的数据无法相互引用。但是，在实际的项目开发中，形如页面和页面之间需要通信一样，Vue 组件和组件之间肯定也需要互通有无、共享状态。接下来在了解组件通信之前，我们先来了解一下组件间的几种关系： 如图所示：
阅读全文
摘要：什么是生命周期？ 从 vue 实例创建、运行、到销毁期间，总是伴随各种各样的事件，这些事件统称为生命周期。 生命周期图 （注：图片来自https://www.bilibili.com/video/BV1sb411M7RT?from=search&seid=16487189305349623461&s
阅读全文
