随笔分类 - vue
摘要：创建bin目录 bat编写 1.下载项目依赖包 @echo off echo. echo [信息] 安装Web工程，生成node_modules文件。 echo. %~d0 cd %~dp0 cd .. npm install --registry=https://registry.npm.taob
阅读全文
摘要：实现table 使用show-summary 合计，合计在表格上层保持不动，效果图如下： <style lang="scss" scoped> ::v-deep .el-table__footer-wrapper{ .el-table__cell{ padding:0.7rem 0; } } ::v
阅读全文
摘要：vue+echarts 实现echarts动效 1.定义 定时器 工具类 loopShowTooltip export function loopShowTooltip(myChart, option, num, time) { var defaultData = { // 设置默认值 time:
阅读全文
摘要：项目背景：vue-cli3 1.在vue.config.js中 引入plugin 压缩文件插件 const FileManagerPlugin = require('filemanager-webpack-plugin') // 压缩文件夹 const packageName = 'dist' //
阅读全文
摘要：项目背景： vue 1.创建 backtop.vue 的回到顶部逻辑的组件 <template> <transition name="back-up-fade"> <div class="back-top" :style="{ bottom: bottom + 'px', right: right
阅读全文
摘要：项目背景：vue3 众所周知在重构的vue3后，vue2的bus总线通信就随之无法使用。 bus总线有点像 Vuex 或者 Pinia ，可以使用发布订阅模式来简单实现下。 不是很了解的同学可以 ♥ 观察者模式浅尝♥ ♥ 发布订阅模式浅尝♥ 原理分析： 参照发布订阅模式 需要一个list来存放相应的
阅读全文
摘要：项目背景：vue3.0 + elementPlus 注意项目结构，主要涉及的几个文件及文件夹 直接上代码 1.最开始是要下载包 npm install svg-sprite-loader 2.配置项目的配置文件 vue.config.js const path = require("path");
阅读全文
摘要：require.context require.context是webpack提供的api require.context(directory,useSubdirectories,regExp) directory:表示检索的目录 useSubdirectories：表示是否检索子文件夹 regEx
阅读全文
摘要：vue报错 TypeError: Cannot read properties of undefined (reading 'ob') 检查组件发现 data () { }, 是data没有return，即使没有使用的变量也需要rerurn {} 解决： data () { return { } }
阅读全文
摘要：项目背景：vue2.6 +elementUI 代码的写法是这样的 发现第一次会触发 computed ，之后就失效了！！进行排查是发现 当utils里面相应的值发生改变 computed 并不会刷新，我们在页面上也能拿到 utils； 首先明确 utils 这个是什么， 引用的工具类 这个有没有进行
阅读全文
摘要：Provide / Inject 也是解决vue组件间传值的一种方案，适合于父子/祖孙 组件之间的传值，也是封装通用组件的一种组合式api Provide/inject 可以理解成依赖注入 一般出现都是成对出现的 Provide 在父组件注入相应的 属性 注意 你的provide的数据改变，inje
阅读全文
摘要：当你是使用 vuecli3.0的打包工程时， vue-cli3.0在打包过程中就使用了terser-webpack-plugin插件进行优化 位置：node_modules/@vue/cli-service/lib/config/terserOptions.js compress对象中 可加入 wa
阅读全文
摘要：vue3相较与vue2 在写法上有较大的出入，刚开始使用是会有诸多不适， setup函数是组合API的核心入口函数 1.setup函数注意点 export default { setup() { } } setup函数的执行时机是在beforeCreate和created之间 由于setup执行时机
阅读全文
摘要：项目背景：qiankun、vue2.0、vuecli3.0 问题：当想在子服务中添加 第三方的js库或者sdk时，在public/index.html内引入相应的js，再在相应的子服务的main.js中 window全局对象上 访问注入的js，这时候问题就出现了 在相应的子服务端口直接访问时，可以访
阅读全文
摘要：vite.config.js 中 import { defineConfig } from 'vite' import path from "path"; import vue from '@vitejs/plugin-vue' // https://vitejs.dev/config/ expor
阅读全文
摘要：解决的痛点 1、开发时，后端还没完成数据输出，前端只好写静态模拟数据。 2、在页面js上写模拟json数据，数据太长了，将数据写在js文件里，完成后挨个改url。某些逻辑复杂的代码，加入或去除模拟数据时得小心翼翼。 3、想要尽可能还原真实的数据，要么编写更多代码，要么手动修改模拟数据。 4、特殊的格
阅读全文
摘要：更换浏览器项目的logo，需要在项目的 打包的根文件index.html下添加页面配置 <link rel="icon" href="<%= BASE_URL %>favicon.ico"> // <%= BASE_URL %> 会默认到public文件夹下面 //是webpack 配置中使 web
阅读全文
摘要：vue-cli命令 vue ui 除了黑窗口，还可以webUI Web端的初始化,体验了一下,效果很不错; vue ui 环境准备 node环境 http://nodejs.cn/ 官网及安装 vue-cli官网 https://cli.vuejs.org/ vue-cli的安装:npm i -g
阅读全文
摘要：qiankun 是一个基于 single-spa 的微前端实现库 官方文档 它的使用及介绍在官方有详细的文档说明，我这主要记录下 开发中遇到的问题， 1.关于 路由 加载404 的问题 使用component: ()=>import('../views/About')的方法来进行加载 会出现Chun
阅读全文
摘要：场景：uniapp开发移动APP h5端的可以使用 ali-oss来实现文件的上传 app端 window许多对象不能使用 就意味着pc的插件组件 在app端不一定适用 1.前端实现oss直传 1.通过uni自带的uploadFile来上传文件 import Oss from '@/js/oss.j
阅读全文
