目录一、Vue程序初体验1.1 下载并安装vue.js1.2 第一个Vue程序 1.3 Vue的data配置项1.4 Vue的template配置项 一、Vue程序初体验可以先不去了解Vue框架的发展历史、Vue框架有什么特点、Vue是谁开发的,对我们编写Vue程序起不到太大的作用,更何况现在说了一些特点之后,我们也没 ......
329
0
0
2023-05-19
目录1. provide/inject2. 自定义v-model3. 事件总线(EventBus)3.1 创建一个全局Vue实例作为事件总线:3.2 在需要发送事件的组件中,使用$emit方法触发事件并传递数据:3.3 在需要接收事件的组件中,使用$on方法监听事件并处理数据:4. render方法4.1 基本语法4.2 创建 VNode4.3 动态数据4. ......
302
0
0
2023-05-19
目录vue-cli-service的参数配置vue-cli-service servevue-cli-service buildvue-cli-service inspectvue-cli中执行的vue-cli-service总结vue-cli-service的参数配置vue-cli-service serveUsage: vue-cli-service s ......
446
0
0
2023-05-18
目录vuex存储数组(新建,增,删,更新),并存入localstorage定时删除使用背景store中实现增删改组件中维护数组,进行判断存入localstorage并设置定时删除自定义实现使用storage-timing插件调用定时删除最终效果vuex存储数组(新建,增,删,更新),并存入localstorage定时删除使用背景初始化一个完整数组,但在业务逻 ......
355
0
0
2023-05-18
目录基础表格固定表头高度/流体高度自定义列宽基础表格首先开发table组件之前,先想好要用什么样式的api,因为笔者在生产工作中用的都是element,所以前面几个组件风格和element类似,但是这次不打算用element的风格了,打算换一种,直接展示:我们期望用户这样使用:<script setup> const dataList = [ ......
328
0
0
2023-05-18
目录如何在vue项目中加载并使用mapbox基本使用开始使用底图切换总结如何在vue项目中加载并使用mapboxmapbox用了感觉确实不错,操作很顺滑,矢量切片体验流畅,地图主题定制化地图漂亮,二三维一体化,二三维切换很是简单,一行代码搞定。基本使用这是mapbox官方文档地址:mapbox文档里面有很多官方例子,基本就是copy下来就能用。开始使用首先安 ......
573
0
0
2023-05-17
目录一次弄懂 Vue2 和 Vue3 的 nextTick 实现原理Vue2 中的 nextTick异步任务队列宏任务和微任务总结Vue3 中的 nextTickPromise 在浏览器中的问题Vue3 中解决 Promise 缺陷的方法总结结论一次弄懂 Vue2 和 Vue3 的 nextTick 实现原理今天是 Wed Apr 26 2023 14:29 ......
324
0
0
2023-05-17
目录chartPan.vue使用 chartPan.vue 之饼图使用 chartPan.vue 之折线图展开大图大图组件 maxChart.vue折线图,饼图chartPan.vue<template> <div> <div class="chart-header" ......
278
0
0
2023-05-16
目录1.pinia介绍2.pinia基本使用2.1注意Store获取到后不能解构,否则失去响应式3.修改state的数据4.getters的使用5. actions的使用6.数据的持久化总结1.pinia介绍pinia 是 Vue 的存储库,它允许您跨组件/页面共享状态。就是和vuex一样的实现数据共享。依据Pinia官方文档,Pinia是2019年由vue ......
416
0
0
2023-05-15
目录前言一、token 登录鉴权二、何为双 token双 token 验证流程注意事项三、服务端代码1. 搭建koa2服务器2. 双token3. 路由4. 应用中间件四、前端代码1. Vue3+Vite框架2. 定义使用到的常量3. 存储、调用过期请求4. 封装axios5. 复用封装6. 接口封装项目运行写在最后前言近期写的一个项目使用双token实现无 ......
290
0
0
2023-05-14
目录vue封装自己的Svg图标组件库安装及配置方法vue使用svg封装图标组件,代替img图片提高性能可行性分析实践方案总结vue封装自己的Svg图标组件库安装及配置方法一、安装组件svg-sprite-loadernpm install svg-sprite-loader --save-dev || yarn add svg-sprite-l ......
362
0
0
2023-05-12
目录轮播图功能-获取数据轮播图-通用轮播图组件轮播图-数据渲染轮播图-逻辑封装轮播图功能-获取数据目标: 基于pinia获取轮播图数据核心代码:(1)在types/data.d.ts文件中定义轮播图数据的类型声明// 所有接口的通用类型 export type ApiRes <T> = { code: string, msg ......
286
0
0
2023-05-11
目录全局前置守卫全局解析守卫全局后置钩子路由独享的守卫组件内的守卫可用的配置 API使用组合 API完整的导航解析流程正如其名,vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航。这里有很多方式植入路由导航中:全局的,单个路由独享的,或者组件级的。全局前置守卫你可以使用 router.beforeEach 注册一个全局前置守卫:cons ......
338
0
0
2023-05-10
目录功能目标快速使用多处调用同一弹窗,多实例 add移除 remove替换 replace更新 update预注册 componentsCache依赖注入usePop 工具函数core 实现core utils工具当UI库弹窗无法满足自定义需求时,需要我们自己开发简单的弹窗组件。弹窗组件与普通业务组件开发没有太大区别,重点在多弹窗之间的关系控制。例如: 弹窗 ......
329
0
0
2023-05-08
目录一、组件间通信最基本方式-props二、组件间通信-vue自定义事件三、组件间通信-事件总线四、组件间通信-v-model五、组件间通信-sync属性修饰符六、组件间通信-$attrs与$listeners七、组件间通信-$children与$parent八、组件间通信-provide与inject九、组件间通信-vuex一、组件间通信最基本方式-pro ......
343
0
0
2023-05-08