Mar272020
Vue 3 TypeScript Vite 实现 Pinia
简介
在 Vue.js 中，我们通常使用 Vuex 来管理应用的状态。然而，Vuex 在一些方面存在一些限制，比如类型推断不够强大，以及在大型应用中的模块化处理上的不便利。因此，一些开发者开始寻找替代方案。
Pinia 是一个基于 Vue 3、TypeScript 和 Vite 的新一代状态管理库，它可以帮助我们更轻松地管理应用的状态。在这篇博客中，我们将探索如何使用 Vue 3、TypeScript 和 Vite 来实现 Pinia...阅读全文
抢沙发
Mar272020
下一代前端框架Svelte 5响应式系统深度解析：性能超越React和Vue的技术预研报告
下一代前端框架Svelte 5响应式系统深度解析：性能超越React和Vue的技术预研报告
引言：前端框架的演进与性能挑战
随着Web应用复杂度的持续攀升，前端框架在构建现代用户界面中扮演着核心角色。从早期的jQuery时代到如今的React、Vue、Angular等主流框架，技术演进始终围绕“提升开发效率”与“优化运行时性能”两大目标展开。然而，在当前阶段，这些框架普遍面临一个根本性矛盾：声明式编程带...阅读全文
Mar222020
Element UI中的面包屑(Breadcrumb)导航实现
什么是面包屑导航？
面包屑导航是一种展示当前路径的导航方式，在网站或应用中经常被使用。通常以一系列链接的形式呈现，每个链接表示当前路径的一个级别。用户可以通过点击链接返回到父级路径。
Element UI中的面包屑导航
Element UI是一套基于Vue.js的桌面端组件库，提供丰富的UI组件，其中包括面包屑导航组件。
在Element UI中，面包屑导航组件的使用非常简单，只需要使用<el-bread...阅读全文
Mar052020
Vue 打包上线后的缓存问题
引言
Vue 是一款流行的 JavaScript 框架，用于构建现代化的前端应用程序。当我们开发完一个 Vue 应用，并且准备将其上线时，我们会面临一个重要的问题，即缓存问题。本篇博客将介绍 Vue 打包上线后的缓存问题，并提供一些解决方案。
什么是缓存？
在Web开发中，浏览器会将一些资源（如JavaScript、CSS 和图片文件）缓存在本地，以便在用户再次访问该网站时可以更快地加载页面。这些缓存的...阅读全文
Feb152020
Feb142020
Vue指令的使用和分类
Vue指令是Vue.js框架中非常重要的概念之一，它用于在HTML模板中为DOM元素绑定事件、属性和样式等。通过使用Vue指令，我们可以实现更高效、更简洁的前端开发。
一、Vue指令的使用
绑定事件
Vue指令可以用于绑定事件，例如：
<button v-on:click="handleClick">点击我</button>
绑定属性
Vue指令也可以用于绑定属性，例如：
<img v-bind:src="imageSrc" alt="图片加载...阅读全文
Jan122020
Uniapp Vue2升级Vue3使用Vite分包
引言
随着Vue3正式发布，许多开发者都迫不及待地想尝试新版Vue的新特性和性能优化。对于使用Uniapp框架进行开发的开发者来说，升级Vue2到Vue3可能是一个不容忽视的事情。在本篇博客中，我将介绍如何在Uniapp中将Vue2升级到Vue3，并使用Vite进行代码打包。
步骤一：升级Vue2到Vue3
首先，在项目根目录下打开终端，运行以下命令安装Vue3的依赖包：
npm install vue@next
接着，在main.j...阅读全文
Jan062020
Vue3 Element Plus封装一个抽屉组件
介绍
抽屉组件是一种常用的交互方式，可以在页面上展示一部分内容并且通过滑动的方式暂时隐藏起来。在Vue3和Element Plus的基础上，我们可以很方便地封装一个抽屉组件，使其更加易于使用和定制化。
准备工作
在开始封装之前，请确保你已经安装了Vue3和Element Plus，并且建立了Vue3的项目。
npm install vue@next
npm install element-plus
功能
我们打算封装一个具有以下功能的抽屉组件...阅读全文
Dec282019
使用Vue.js和Vuex构建高效的数据流管理
在现代前端开发中，随着应用程序的复杂程度不断增加，有效地管理数据流变得至关重要。Vue.js是一个流行的JavaScript框架，提供了一种简洁、直观的方式来构建Web应用程序。Vue.js的核心特点之一是它的响应式数据绑定系统，使开发者能够轻松地处理视图和数据之间的关联。然而，当应用程序变得庞大且包含多个组件时，需要一种更一致的方式来管理应用程序的状态。
Vuex是一个基于Vue.js的状态...阅读全文
Dec202019