- 博客(65)
- 资源 (9)
- 收藏
- 关注
RSS订阅原创 vue2打包时遇到的Error: CSS minification error:css\chunk-bac522ec.172852655309.css:2406:12: Unknown word.
vue2打包时遇到的Error: CSS minification error:css\chunk-bac522ec.172852655309.css:2406:12: Unknown word.
2024-10-10 10:56:17
327
原创 vue2和vue3项目使用signalr插件，前后端如何配合的
ue2项目使用signalr插件，前后端如何配合的。前端单独封装signalr.js配置断线自动重连，然后前端初始化signalr配置，以及关闭vue页面时断开signalr链接。
2024-08-13 15:15:58
1298
原创 vue3使用openlayers然后添加自定义背景图层和标记点，标记点使用自定义图标以及点击标记点悬浮详细内容
在Vue3中使用OpenLayers，首先需要安装OpenLayers库然后，在Vue组件中引入OpenLayers并使用它创建一个地图示例总结上述代码是一个使用 Vue 3 和 OpenLayers 实现添加自定义背景图层、自定义图标标记点，并在点击标记点时显示带有查看轨迹和关闭轨迹按钮的悬浮框的示例。首先，导入了 OpenLayers 所需的模块和样式。创建了地图对象 map ，设置了背景图层的 URL 、初始中心坐标和缩放级别。markerFeatures 数组用于存储标记点的特征。
2024-08-08 15:58:10
852
原创 vue2使用openlayers然后添加自定义背景图层和标记点，标记点使用自定义图标以及点击标记点悬浮详细内容
在Vue中使用OpenLayers，首先需要安装OpenLayers库然后，在Vue组件中引入OpenLayers并使用它创建一个地图示例总结上述代码实现了在 Vue2 中使用 OpenLayers 创建地图，并添加自定义背景图层、自定义图标的标记点，同时实现了点击标记点显示悬浮框，悬浮框中包含查看轨迹和关闭查看轨迹的按钮。以下是对关键部分的更详细解释：在 mounted 钩子中，首先创建了地图对象，设置了背景图层和初始视图。然后调用 addMarkers 方法添加标记点，并监听地图的点击事件。
2024-08-07 15:03:17
781
原创 原生html table固定表头,后台返回一个数组对象有多个值,根据表头需要的字段显
这段代码首先定义了一个表格，并在JavaScript中获取了它的元素。然后，它遍历了一个示例数据数组，为每个对象创建一个表格行，并且只根据表头需要的字段（id、name、age）插入数据。这样，即使数组中的对象有多个值，表格也只会显示所需的字段。原生html要实现固定表头并根据需要显示的字段渲染后端返回的数组对象，就需要使用JavaScript来渲染DOM。
2024-05-16 09:20:46
295
原创 Vue中使用Element UI的Table组件实现嵌套表格(最简单示例)
在上面的示例中，我们定义了一个包含姓名和年龄的主表格，以及一个展开列用于显示与每行相关联的子表格。子表格包含一个名为“子项目”的列。通过将row.subData传递给子表格组件，我们可以根据当前行的数据动态渲染子表格。请注意，这只是一个简单的示例，您可能需要根据自己的需求进行适当的调整。
2024-01-05 10:24:20
2398
原创 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
3533
6
原创 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
2253
原创 vue2提取vue-router的title单独存放，使用i18n实现
vue2提取vue-router的title单独存放，使用i18n实现
2023-02-21 14:46:27
1263
1
原创 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
2189
原创 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
4792
23
原创 多个数组合并成一个数组对象
在项目开发过程中，由于后台返回的数据格式并不一定完全满足前端的需求，所以需要通过前端数据处理。我的实际开发场景是el-tableel-table-column 原有的字符串数据满足不了，所需数据格式需要在el-table-column里要展示多个数据并且可以点击弹框操作。这个时候后台返回的数据需要进行二次处理方可实现。 需要讲这三个字符串拼装成数组对象，首先是将字符串用split切割成数组this.tableData[i].bsqrName=this.tableData[...
2021-03-29 11:32:09
2589
原创 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
1366
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
1463
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
2693
2
原创 vue 实现父子组件之间的传值
vue项目开发过程中，封装公共部分的代码进行多页面调用是很经常的事，实际开发过遇到太多，也总结记录下自己的方式。目录结构：父组件调用并传值给子组件：（直接下代码）父组件给之组件传值通过 ：+自定义名 （必须和子组件props定义的字段名一致）父组件给之组件传方法 @+自定义方法名子组件传值给父组件：（直接下代码）子组件接收父组件通过 props进行接收，并且子组件接收需要定义变量的数据类型子组件通过this.$emit调用给父组件回传值父组件：...
2020-12-04 16:14:39
331
原创 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
5953
原创 微信小程序获取微信头像和名称
微信小程序开发过程中，个人中心通常都需要实现微信头像和微信名称展示，微信开发已经有封装好的组件，直接在你需要的地方引入代码块就行，type数据类型需要开发过程中按需引入，微信官方文档：<open-data type="userAvatarUrl"></open-data>//userAvatarUrl是获取微信头像open-data基础库 1.4.0 开始支持，低版本需做兼容处理。用于展示微信开放的数据。属性 类型 默认值 必填 说明
2020-10-14 12:13:43
2767
原创 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
581
原创 vscode前端开发插件
vscode前端开发个人存储的干货（前端开发使用的插件）：1. Auto Close Tage 自动闭合HTML/XML标签2. Auto Rename Tag 自动重命名配对的HTML / XML标签3. AutoFileName 文件路径提示4. EaseServer ...
2020-08-25 18:05:19
290
原创 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
687
原创 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
5280
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
6494
原创 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
529
原创 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
3253
2
原创 （vue+element）解决两个表单通过if判断切换 表单验证发生冲突的问题
（vue+element）解决两个表单通过if判断切换 表单验证发生冲突的问题需求：根据不同的类型进行form切换，以及要实现表单校验失败尝试：再每个不一样的form里每个子元素加了key不行（错误示范）可能造成的原因：即使两个表单绑定的值不同，但是浏览器在解析时，先解析第一个表单，此时表单上是有绑定ref，之后再解析第二个表单时，浏览器发现这它的prop和第一个表单的prop一样，所以就认为这两个表单是同一个表单，就没有重新渲染，而ref本身是作为渲染结果被创建的，所以第二个表单没能.
2020-07-29 18:26:34
2301
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
4219
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
6650
原创 vue--前端接收后台传过来的excel文件数据
vue--前端接收后台传过来的excel文件数据最近项目要实现把前端展示的列表导出功能，但是接口是post请求，无奈之前做的get请求不能复用。上网开了一下帖子基本是用blob实现下载，以下是我的代码：index.vue api.pageCzZlxx(params).then((res) => { var blob = new Blob([res], { type: 'application/vnd.ms-excel' }) // type这里表示x
2020-05-20 19:04:18
5104
2
原创 vue项目 onresize() 监听窗口实现echarts地图自适应
window.onresize() 监听窗口实现echarts地图自适应项目需求变动，之前是做大屏的尺寸没考虑周全，echarts地图没有随大小变化而变化，现在要实现自适应只需要小改动即可。修改前：修改的代码： <div class="g-h100 g-w100" ref="map" style="position:relative;z-index: 1;"> </div>
2020-05-13 12:47:54
2395
原创 微信小程序tab点击监听方法：onTabItemTap()管理是否登陆
微信小程序tab点击监听方法：onTabItemTap()在页面没有获取user或者没有登陆成功的时候，再page页面（首页）点击任何功能都让其返回登陆页面，可以用onTabItemTap()函数进行控制。 onTabItemTap() { let self = this if (!wx.getStorageSync('user')) { wx.showM...
2020-04-30 10:46:21
7635
4
原创 vue项目 关于Elemet-ui组件Cascader中proper的配置问题和获取value和lable的值以及清空Cascader的值
关于Elemet-ui组件Cascader中proper的配置问题最近项目需要做一个多联动的select，但是后台返回来的数据和ele参考的结果有些不一样ele提供参考的结构，例子没有 具体说明那个如何去传写数据，具体要看props配置文件这是后台返回来的结构，我现在就不用真实数据进行展示结构代码： <el-cascader placeholder...
2020-04-14 16:11:10
752
原创 vue--Element-UI Table 表格指定列添加点击事件
Element-UI Table 表格指定列添加点击事件最近使用了Element-UI中的Table表格，因为需求需要在指定的列点击跳转，所以必须添加个点击事件，我这里是弹框展示table再点击跳转的，如图所示：下面是我实现具体的代码(只是代码的一部分，我删减出来的)<template> <el-dialog custom-class="m-dial...
2020-04-11 16:30:20
20239
13
原创 vue--this.$set()数据回显
vue数据回显 最近在修改别人的一个bug，数据回显效果出不来的bug。开始的时候没头绪，经过百度一脑子查询和本地调试，终于解决。我用到vue的this.$set()来进行强制更新实现的，但是有一点需要注意的，对象操作的方法：三个参数：this.$set("改变的对象"，"改变的对象属性"，"值") 数组操作的方法： 三个参数：this.$set("数组"，"下标"，"值"...
2020-03-11 10:20:21
1605
wepy小程序开发视频
2020-08-26
validate.js
2020-08-20
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人