- 博客(71)
- 资源 (9)
- 收藏
- 关注
RSS订阅原创 Vue中使用Element UI的Table组件实现嵌套表格(最简单示例)
在上面的示例中，我们定义了一个包含姓名和年龄的主表格，以及一个展开列用于显示与每行相关联的子表格。子表格包含一个名为“子项目”的列。通过将row.subData传递给子表格组件，我们可以根据当前行的数据动态渲染子表格。请注意，这只是一个简单的示例，您可能需要根据自己的需求进行适当的调整。
2024-01-05 10:24:20
1563
原创 vue el-table的每行操作el-button添加单独的loading效果实现
你的压力来源于无法自律，只是假装努力，现状跟不上内心的欲望，所以你焦虑又恐惧。
2023-07-07 16:25:12
2240
原创 vue3项目打开本地pdf文件实现方法
一个人久了连喜欢上一个人都好难，不要轻易地拒绝学习新知，因为你所拒绝的不是别人，而是你自己的成长之路。
2023-07-06 13:41:34
3348
2
原创 vue2 h5开发前进刷新后退缓存实现
在app.vue（我这里主要在layout.vue修改）使用 keep-alive :include ，includedComponents 是仓库管理的状态HistoryTask.vue需要缓存的页面index.vue --> HistoryTask.vue,以此类推a–>b–>c–>dHistoryTask.vue -->index .vue,必须销毁当前页面通过this.$destroy()实现d–>c–>b–>a
2023-06-19 15:11:28
367
原创 vue3打包踩坑记录‘readFile‘ is not exported by __vite-browser-external, imported by node_modules/pdfjs-dist
因为vue3项目是用不了vue-pdf所以用了pdfjs-dist，开发环境pdf查看是没问题正常使用，只是在打包的时候就报错，应该是由于pdfjs-dist.js使用了fs,fs是nodejs环境下的工具库,所以vite才会报错。2、vite.config.js配置。这样轻松搞定打包报错问题。
2023-06-09 16:56:22
2292
原创 vue3打包踩坑记录 ERROR: Top-level await is not available in the configured target environment (“es2015“)
因为做动态配置IP及端口，打包后随时改随时生效 ,代码使用了let baseURL = await axios.get(‘./config.json’);我也是参照了网上其他博主的方法，这里只是做个人项目踩坑记录。2、vite.config.js配置。
2023-06-09 16:31:39
1462
原创 vue2提取vue-router的title单独存放，使用i18n实现
vue2提取vue-router的title单独存放，使用i18n实现
2023-02-21 14:46:27
957
1
原创 vue element tree 页面左侧是一个部门树（异步加载），右侧是部门table表格数据，修改右侧table数据左侧tree局部刷新
开发要求：页面左侧是一个部门树（异步加载），右侧是部门table表格数据，修改右侧table数据左侧tree需要局部刷新。不管是哪个操作都要调用refreshNodeBy(id)方法才可以。这里table的代码和方法就省略…
2023-01-13 17:31:08
1688
原创 VUE2使用使用百度视频播放器实现视频点播
百度播放器实现的代码就这么多，只做参考。主要代码可以当做组件直接引用到项目，但是主要业务还是需要根据自己需求来，如果没有效果多调试下。第一步：在项目的根目录下找到public文件夹，然后再public文件夹下方的index.html，引入jessibuca.js。第二步：public/index.html页面引入。
2022-12-28 15:47:59
1443
2
原创 vue2+百度离线地图实现多车辆行驶动态轨迹
有个缺点就是如果数据量庞大会导致浏览器性能消耗严重，因为这里使用了定时器实现，应该有更好的办法实现，完成改功能效果需要连个接口，①初始化坐标点接口，②增量坐标点接口。实现多车辆实时轨迹监控，每个10秒监测一次接口，进行动态追加。vue2+百度离线地图实现行驶车辆动态轨迹。
2022-12-02 17:11:19
3673
3
原创 vue项目开发 实现自定义Transfer穿梭框效果(结合el-tree)
vue项目开发 实现自定义Transfer穿梭框效果(结合el-tree)
2022-09-02 14:12:29
2745
原创 el-table父节点击button按钮新增子节点并展开子节点树
el-table父节点击button按钮新增子节点并展开子节点树element el-table自带属性和自定义处理方法默认方式自定义写法自定义优缺点element el-table自带属性和自定义处理方法element默认属性只能是在初始化加载时展开或点**>时进行展开树节点，但是如果实际项目需求是初始化加载的时候树节点是收起状态，然而点击展开并不是只能点击>,这样操作很不友好。初始化点击展开树节点，默认是通过懒加载lazy配合:load**进行，而自定义方法需要抛弃这样的操作，父节点击b
2021-06-18 15:19:50
2326
2
原创 element-UI Table el-table树形数据选择高亮，多项选择checkbox选中父级节点和子节点，行高亮的问题处理
el-table实现父节点和子节点选择后背景颜色高亮项目客户要求点击多选的时候，需要对选中的行都进行高亮，通过了很多方法尝试，最后简单实现，下面直接上代码：html主要代码 <el-table ref="multipleTable" v-loading="listLoading" :data="list" size="small" style="width: 100%"..
2021-06-08 00:31:21
2008
原创 vue纯前端导入excel，获取excel的表格数据渲染el-table并纯前端分页实现方法
因为项目开发的过程中不是所有的表格数据由后台处理返回，因为有些数据不需要在数据库落地，只做前端页面展示并且获取表格的数据上传即可，所以需要前端纯处理excel的数据。第一步首先把插件安装好npm install xlsx --save第二步在vue页面中导入XLSX<script> import XLSX from 'xlsx'</script>第三步页面实现 <el-upload ref="upload" act.
2021-04-08 21:11:06
4395
23
原创 多个数组合并成一个数组对象
在项目开发过程中，由于后台返回的数据格式并不一定完全满足前端的需求，所以需要通过前端数据处理。我的实际开发场景是el-tableel-table-column 原有的字符串数据满足不了，所需数据格式需要在el-table-column里要展示多个数据并且可以点击弹框操作。这个时候后台返回的数据需要进行二次处理方可实现。 需要讲这三个字符串拼装成数组对象，首先是将字符串用split切割成数组this.tableData[i].bsqrName=this.tableData[...
2021-03-29 11:32:09
2449
原创 vscode终端创建目录报错受限处理 vue : 无法加载文件 D:\Software\NodeJs\node_global\vue.ps1，因为在此系统上禁止运行脚本
新电脑配置好了node，然后在vscode终端准备创建一个vue目录来的 ,执行vue create vue3-1 报错下如图因为在此系统上禁止运行脚本,PowerShell的执行政策阻止了该操作,解决方法如下：1、查看是否是受限状态：Get-ExecutionPolicy 显示Restricted（受限状态）PS E:\vue3.0> Get-ExecutionPolicyRestricted2、如果是受限状态，先接触首先状态使用：Set-ExecutionPoli...
2021-03-16 00:08:30
1249
6
原创 vue项目开发自定义步骤条，自定义高亮
项目开发过程中很多时候element的UI组件和实际项目的需求有一样，不能直接服用，我这里是自定义实现步骤条方式下面直接展示代码（代码已经有所修改，但是结构没变）<template> <div class="ul_box"> <ul class="timeline" ref="mytimeline" style="margin-left: 10px;"> <li class="tim.
2020-12-30 17:44:56
1262
1
原创 vue+element开发使用el-select不能回显处理
下拉框选择的时候，选不上下拉框的值，element提供了@change事件使用vm.$forceUpdate() 方法进行强制刷新，就可以把值渲染上去。 <el-select v-model="price" clearable placeholder="请选择" @change="$forceUpdate()"> <el-option v-for="(item, ..
2020-12-22 10:32:22
2528
2
原创 vue 实现父子组件之间的传值
vue项目开发过程中，封装公共部分的代码进行多页面调用是很经常的事，实际开发过遇到太多，也总结记录下自己的方式。目录结构：父组件调用并传值给子组件：（直接下代码）父组件给之组件传值通过 ：+自定义名 （必须和子组件props定义的字段名一致）父组件给之组件传方法 @+自定义方法名子组件传值给父组件：（直接下代码）子组件接收父组件通过 props进行接收，并且子组件接收需要定义变量的数据类型子组件通过this.$emit调用给父组件回传值父组件：...
2020-12-04 16:14:39
285
原创 vue项目开发--使用三元表达式动态改变样式效果
项目开发js经常会使用到三元表达式判断，css也不例外，使用三元表达式可以轻松解决。使用style动态改变样式的写法：<!-- 这里是改变字体的颜色 --> <p :style="{'color': (item.pqtjzt=='20' ? '#00ffff': item.pqtjzt=='11'?'#00ff00' : item.pqtjzt=='10'?'#fdb14b' :'#ff0000')}">调解状态: {{ item.pqtjztmc }}</p>
2020-10-28 10:38:07
5655
原创 微信小程序获取微信头像和名称
微信小程序开发过程中，个人中心通常都需要实现微信头像和微信名称展示，微信开发已经有封装好的组件，直接在你需要的地方引入代码块就行，type数据类型需要开发过程中按需引入，微信官方文档：<open-data type="userAvatarUrl"></open-data>//userAvatarUrl是获取微信头像open-data基础库 1.4.0 开始支持，低版本需做兼容处理。用于展示微信开放的数据。属性 类型 默认值 必填 说明
2020-10-14 12:13:43
2591
原创 vue实现点击当前栏目高亮效果
vue实现点击当前栏目高亮效果下面的栏目是通过矢量字体图标遍历出来的首先在data定义一个数组 data() { return { columnBtn: [ { name: 'el-icon-back' }, { name: 'el-icon-s-home' }, { name: 'el-icon-menu' }, { name: 'el-icon-user-solid' }, { nam
2020-09-10 16:39:34
486
原创 vscode前端开发插件
vscode前端开发个人存储的干货（前端开发使用的插件）：1. Auto Close Tage 自动闭合HTML/XML标签2. Auto Rename Tag 自动重命名配对的HTML / XML标签3. AutoFileName 文件路径提示4. EaseServer ...
2020-08-25 18:05:19
222
原创 React基础学习
1. React简介React 起源于 Facebook 的内部项目，因为该公司对市场上所有 JavaScript MVC 框架，都不满意，就决定自己写一套，用来架设 Instagram 的网站。做出来以后，发现这套东西很好用，就在2013年5月开源了React 是一个用于构建用户界面的 JAVASCRIPT 库。React主要用于构建UI，很多人认为 React 是 MVC 中的 V（视图）React 拥有较高的性能，代码逻辑非常简单，越来越多的人已开始关注和使用它React中文官网Rea
2020-08-25 17:20:33
607
原创 vue项目开发：element的el-form表单rules如何对input和select添加号码校验
在项目开发的时候，一般表单检验都是做非空检验即可，但是难免会遇到证件号码或者手机号校验，通常我们都要调用公共js进行实现，input校验较为简单，但是select如果没有用过的还是会有点头疼。下面我将对我在项目开发的一部分校验跟大家分享一下。首先肯定要准备好公共js（validate.js）基本结构是必要的:rules="formRules" 和prop="dsrmc" <el-form ref="editAdminForm" ..
2020-08-22 19:24:38
5106
4
原创 vue项目依赖包加载问题：Run `npm rebuild node-sass` to download the binding for your current environment.
error in ./src/views/createResume.vue?vue&type=style&index=0&lang=scss&Module build failed (from ./node_modules/sass-loader/dist/cjs.js):Error: Missing binding c:\Users\Administrator\Desktop\vue-study-master\vue-study-master\node_mod...
2020-08-20 17:39:25
4849
原创 wepy开发小程序：人脸识别登陆的实现方法
小程序人脸识别的实现方法下面直接贴出实现的代码：login.wpy <template> <div class="m-btnGroup"> <button class="u-btn u-btn-main br10 md20" hover-class="none" @tap="login">人脸识别登录</button> </div> </template> &
2020-08-11 14:55:43
476
原创 vue+ele 实现v-for动态数据循环表单，然后对每个结构进行表单校验的方法
vue+ele 实现v-for动态数据循环表单，然后对每个结构进行表单校验的方法项目开发时遇到form结构是动态遍历出来的，但是每个遍历出来的表单都需要做相对应的检验处理，ele提供的办法只能对单个表单有效，mou度很多方法都试了，但是都没有说出重点和要注意的地方！！！下面贴出我实现的代码： <el-form label-width="200px" class="dlrMode" ref="addInfo" :rules="DLRRules" :model="add
2020-08-08 16:15:36
3094
2
原创 （vue+element）解决两个表单通过if判断切换 表单验证发生冲突的问题
（vue+element）解决两个表单通过if判断切换 表单验证发生冲突的问题需求：根据不同的类型进行form切换，以及要实现表单校验失败尝试：再每个不一样的form里每个子元素加了key不行（错误示范）可能造成的原因：即使两个表单绑定的值不同，但是浏览器在解析时，先解析第一个表单，此时表单上是有绑定ref，之后再解析第二个表单时，浏览器发现这它的prop和第一个表单的prop一样，所以就认为这两个表单是同一个表单，就没有重新渲染，而ref本身是作为渲染结果被创建的，所以第二个表单没能.
2020-07-29 18:26:34
2167
2
原创 element-ui 表单清空 resetField()方法报错Cannot read property ‘indexOf‘ of undefined
在使用resetField 报错Cannot read property 'indexOf' of undefinedelement-ui 表单清空 resetField()方法在项目应用的时候，报错具体代码如下（真实开发场景）这样很明显报错了，应该是数据挂载顺序得问题导致。尝试修改（失败）然后试了我就把v-if改为了v-show，好像是可以实现关闭弹窗，但是我点击保存form表单数据的校验还是会走我隐藏掉的那一模块进行数据校验，所以果断放弃。尝试修改（成功...
2020-07-28 16:05:46
3696
9
原创 vue使用element中的input组件实现传多个值和input回显强制刷新
vue使用element中的input组件实现传多个值和input回显强制刷新 在项目开发过程使用input遇到的小问题，直接从element拿取过来的input组件是没问题的，但是存在着如果给input的value设置默认值，再次进行操作的时候就会获取不到value回显，无用你怎么用$set()都无济于事，后来经过查询 vue中的$forceUpdate可以强制更新表单，使用了果真奏效。 顺带引出一下input的@input或@change事件如何传递多个值进行相关操作...
2020-06-20 18:10:41
6199
wepy小程序开发视频
2020-08-26
validate.js
2020-08-20
系统集成软考中级备考视频下
2019-01-08
系统集成软考中级备考视频上
2019-01-08
dubbo.xsd分享
2018-01-29
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人