- 博客(73)
- 资源 (5)
- 收藏
- 关注
RSS订阅原创 el-upload 上传图片转成base64 字符串，传给后端，且base64在页面的展示
【代码】el-upload 上传图片转成base64 字符串，传给后端，且base64在页面的展示。
2024-07-22 11:00:47
511
原创 纯前端实现将页面数据下载word文档中【包括图片，echarts图，表格，和对话 内容】
在Vue中导出Word文档，可以使用第三方库file-saver和html-docx-js。
2024-05-20 10:27:05
393
1
原创 vue更新数据
在 Vue 中，一个数组在更新时，如果数组里的元素是数组或对象的话，需要注意数组或对象的引用关系。如果这些数组或对象被修改，但数组本身的引用没有发生变化的话，Vue。是不会检测到这些变化的，因为 Vue 只会对数据做浅层次的检测。
2023-05-23 15:02:57
890
原创 vue中给@相关的事件传递“额外“参数
暴露给父组件的方法，因业务场景的需要，需要在父组件中传递额外的参数，这时该方法又有子组件传递过来的参数，需要在不改变该方法默认参数的情况下，额外传递参数，使用。场景：在开发中会遇到，当通过this.event 来传递，即可解决当前问题。
2023-05-23 14:55:33
1203
原创 解决cnpm无法加载文件
问题描述解决cnpm无法加载文件好不容易安装好了cnpm，结果运行cnpm -v的时候又报错cnpm : 无法加载文件C:\Users\14164\AppData\Roaming\npm\cnpm.ps1，因为在此系统上禁止运行 脚本。有关详细信息，请参阅https:/go.microsoft.com/fwlink/?LinkID=135170 中的 about_Execution_Policies。原因： 系统禁止运行脚本解决方案：快捷键：win+R —打开窗口输入；Power
2022-04-21 10:37:01
838
原创 webstorm如何调试vue项目的js
安装webstorm下载安装https://www.jetbrains.com/webstorm/个性化设置，页面与快捷键可以导入http://blog.csdn.net/wm5920/article/details/76566114这里的jar包license server激活地址修改webpack.dev.conf.js将devtool: config.dev.devtool改为devtool: 'source-map'...
2022-04-20 15:36:33
1046
原创 JDK1.8安装和环境配置
安装1、运行JDK安装包jdk-8u181-windows-x642、进入开始安装向导界面，单击下一步。如图所示。3、选择jdk安装目录。单击“下一步”。4、开始安装，等待安装完成。5、单击确定，继续安装。6、默认选择，单击“下一步”。7、等待安装完成。如图所示。8、安装完成。点击“关闭”。接下来配置环境变量。9、配置环境变量。打开控制面板，选择“系统和安全”，选择“系统”，选择“高级系统设置”。如图所示。10、打开后，选择“环境变量”。如图所示。环境变量配置11
2022-04-19 11:42:15
11500
原创 js异步编程
promiseJs中进行异步编程的新的解决方案（传统的解决方案——回调函数和事件），用于表示一个异步操作的最终完成 (或失败), 及其结果值.。promise 有三种状态Pending（进行中，初始状态，既不是成功，也不是失败状态。）、Resolved（已完成，又称 Fulfilled）、Rejected（已失败）这三种状态的变化途径只有2种： 异步操作从 未完成 pending => 已完成 resolved 异步操作从 未完成 pending =>失败 rejected 状态
2022-03-29 17:10:40
90
原创 vue.js中的computed计算属性如何传递参数
omputed：注意不能直接在photoList后面加参数，没效果（应该是vue不支持），应该以JavaScript闭包的形式：computed: { photoList() { return function(value){ var imgList = []; for(var i=0;i<value.length;i++){ imgList.push({src: value[i]});
2022-03-29 17:00:48
1887
原创 vue中通过js加载图片显现
在vue开发中会遇到这样的问题：有时需要在img中加载多个静态资源的图片，如果我们将src的路径整个定义成一个变量，会发现img加载不出来正个图片的路径，其实此时需要require()来加载静态资源的路劲在vue中通过js加载图片路径需要用 require() 加载图片路径<img :src="titleIcon" class="title-icon">{{ title }}</img> computed: { titleIcon() { r...
2022-03-28 10:35:32
1558
原创 接口实现表格上传和下载
下载excel表格/** * 1. 接口调用 * @param {*} data url * @param {*} filename 名称 */export function downloadExcel() { getExcel().then( res => { const blob = new Blob([res.data], { type: '' }) downloadFileWithBuffer(blob, 'demo.xlsx') })
2022-03-28 10:23:14
425
原创 前端实现打印功能（纯前端实现）
使用插件 vue-print-nb第一种方法：通过npm 安装插件1，安装install vue-print-nb --save2，引入 安装好以后在main.js文件中引入import Print from 'vue-print-nb' Vue.use(Print); //注册3，现在就可以使用了<div id="printTest" > <p>锄禾日当午</p></div><button v-print="'#pri
2022-03-28 10:06:49
1313
原创 JS中将相同属性的对象合并成一个数组
原数组如下let resData = [ { "name": "住院医疗最高报销", "tagName": "医疗", "insuredAmount": "6000" }, { "name": "身故赔付", "tagName": "寿险", "insuredAmount": "36.00" }, { "name": "烦死了免费陈.
2022-03-23 14:54:20
349
原创 element-ui table 表格组件合并相同行
效果如下代码<template> <el-table :data="tableData" :span-method="objectSpanMethod" border style="width: 100%"> <el-table-column prop="lv1" label="一级巡查项"/> <el-table-column prop="lv2" label
2022-03-16 14:16:22
1181
原创 Vue中父子组件生命周期执行顺序(父子组件和mixins的生命周期执行顺序)
父子组件生命周期执行顺序结论父组件先创建，然后子组件创建；子组件先挂载，然后父组件挂载。执行顺序父beforeCreate-> 父create -> 子beforeCreate-> 子created -> 子mounted -> 父mounted复制代码子组件挂载完成后，父组件还未挂载。所以组件数据回显的时候，在父组件mounted中获取api的数据，子组件的mounted是拿不到的。父子组件和mixins的生命周期执行顺序执行顺序mixin的crea
2022-03-15 11:45:51
1767
原创 vue前端导出（XLSX）
import XLSX from 'xlsx'exportExcel() { let exportTableData = [] let tmpCon = [] let propList = [] this.columnData.forEach(column => { tmpCon.push(column.label) propList.push(column.prop) }) exportTab
2022-03-11 14:28:48
1273
原创 webstorm常用的插件
GitToolBox其实就是给 ide 扩展了一下 git 相关的功能，比如会自动帮你 fetch 最新的代码（我之前都是两下 shift，然后输入 fetch查找到对应的命令然后回车，麻烦），单行代码后面显示提交信息等等。RainBow Brackets可以把括号变成彩色的，更便于阅读。Json Parser前端开发者一般情况下接触到JSON格式特别多，但是每次想要格式化JSON数据都需要通过打开浏览器到对应的格式化网站，通过这个插件，你可以直接在IDE中进行格式化。TabNi
2022-03-02 09:56:15
10435
原创 多个接口可以封装成一个接口处理
在开发中会遇到这样的修求，可能一个页面会根据不同的情况会请求多个接口，返回一样的结果。如果各个接口分别编写一次，先的很搂，并且代码冗余。那么分装成一个方法来请求。解决办法：其实就是将写一个方法，return请求接口，用另一个方法来接收结果分装后的代码import {saleDeptAnalysis,userAnalysis,contractIndustry} from '@/api/bi/customer' //接口/** * 查询表格数据，接口接口返回的数据 * @par.
2022-03-01 17:53:10
1719
原创 vue组件多层级传值(爷爷组件和孙子组件直接传值)+provide + inject
有时一个页面，其实由许多组件构成，并且这些组件，层层嵌套，层次可能很深。这时问题就来了，假如有一些参数，从顶层组件就开始设置或提供，然后最底层的组件又需要，层层传递，不仅繁琐、容易出错，反而不利于代码的可维护和可读。有没有一种方法，可以直接由顶层组件传播到最底层呢？或者说，可以让最底层能直接接收到顶层的参数呢？有的，provide + inject。顶层组件provide，底层组件inject。但是，这只能保证一次成功，以后参数改变了，底层并不能感知。这时又要加上computed和watch，并且参.
2022-03-01 13:51:10
780
原创 vue中使用插件实现excel导出
1. 安装相关依赖主要是两个依赖npm install --save xlsx file-saver2.组件里头引入import FileSaver from 'file-saver'import XLSX from 'xlsx'3.调用 exportExcel () { var wb = XLSX.utils.table_to_book(document.querySelector('#out-table')) var wbout = XLSX.wri
2022-02-28 15:56:11
581
原创 linux操作指令
删除文件使用：rm命令参数：-r 向下递归，不管有多少级目录，一并删除；-f 直接强行删除，不作任何提示的意思例如： rm -rf public -m :斜杠开头表示参数重命名文件或文件夹:mvmv dist public表示：将文件夹dist重命名为public复制文件或文件夹：cpcp ./public/ wkcrm:/opt/package/gateway/表示：将public文件以及文件里的文件复制到路径geteway下 cp后跟路径切换路径：cdcd
2022-02-24 20:21:40
393
原创 git学习
git cherry-pickgit cherry-pick ：将一个分支的一条记录提交到另一个分支上例如：第一步：git cherry-pick e6476aaaa1be9415e5ab223520f6b068d82dbd2b第二步：git pull (推送)单个commit只需要git cherry-pick commitid多个commit 只需要git cherry-pick commitid1..commitid100......
2022-02-24 16:45:59
68
原创 elelment ui 动态渲染表头和表格数据
<el-table :data="columnList" :height="400" :loading="tableLoading" stripe border highlight-current-row> <el-table-column v-for="(item, index) in columnData" :key="index" :prop="item.prop" :label="item.label" a.
2022-02-22 14:30:04
905
原创 vue中mixins的用法(混入对象的使用)
作用 多个组件可以共享数据和方法，在使用mixin的组件中引入后，mixin中的方法和属性也就并入到该组件中，可以直接使用。钩子函数会两个都被调用，mixin中的钩子首先执行。vue中的mixins可以定义哪些内容呢？官网的说明：混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被混入该组件本身的选项。大致意思就是：1） 混入对象的内容必须是一个对象。2） 当使用混入时，相同的内容都会合并。3） 数据对象如果有相同的，则以被混入的对象中data数据为准注意：1
2022-02-18 18:22:45
1138
原创 vue中监听路由和路由参数的变化
问题描述在同一个路由下，只改变路由后面的参数值 / 改变路由，比如 /test?id=1 ，在这个页面中点击一个按钮后 跳转到 /test?id=2 ，但从“/test?id=1”到“ /test?id=2”是不会触发vue的生命周期的，id变了，但页面数据不会更新。解决办法监听路由参数的变化，在watch里监听$route和路由参数watch: { $route(){ this.userId= this.$route.query.id }, }...
2022-02-18 18:05:13
1077
原创 computed和watch的使用场景和区别
使用场景watch和computed各自处理的数据关系场景不同1.watch擅长处理的场景：一个数据影响多个数据2.computed擅长处理的场景：一个数据受多个数据影响区别```javascript1、功能上：computed是计算属性，watch是监听一个值的变化，然后执行对应的回调。2、是否调用缓存：computed中的函数所依赖的属性没有发生变化，那么调用当前的函数的时候会从缓存中读取，而watch在每次监听的值发生变化的时候都会执行回调。3、是否调用return：compu
2022-02-17 16:35:19
1247
原创 Vue计算属性computed传递参数
computed：注意不能直接在photoList后面加参数，没效果（应该是vue不支持），应该以JavaScript闭包的形式：computed: { photoList() { return function(value){ var imgList = []; for(var i=0;i<value.length;i++){ imgList.push({src: value[i]}); .
2021-12-06 21:51:31
904
公司离职证明模板文件下载
2020-04-10
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人