- 博客(43)
- 收藏
- 关注
RSS订阅原创 url加时间戳方法及作用
场景复现：在页面通过绑定url显示一个图片，当鼠标移动到图片上面时显示上传阴影图标，上传完成之后，显示最新的图片。产生问题：上传图片之后，页面显示的图片并没有发生变化，刷新几次浏览器之后才会发生变化。解决方案：将绑定的图片url后面加上时间戳。原来url "https://uatcdn.software.com/upload/one.png"修改后url "https://uatcdn.software.com/upload/one.png"+'?timestamp=' + new
2022-02-09 18:34:35
5844
原创 iview menu导航菜单手动更新子目录
ps:需求是不点击menu,但触发某一个别的方法要打开指定的子目录。解决方法：当指定的方法被触发时，首先在改变menu组件绑定的:active-name值，然后 在nextTick调用updateOpened、updateActiveName两个方法。<Menu :active-name="activeName" ref="menuRef" :theme="theme" :open-names="[openMenu]" @on-select='menuSelect' width='200' ac
2022-01-18 18:57:36
564
原创 vue项目记录页面滚动条高度，再次返回该页面时自动滚动到当前高度
一、离开当前页面之前保存滚动条高度我的项目页面切换用到了elementUI的tabs组件,所以每次页面切换前都会调用beforeLeaveTab方法，故在该方法中保存离开页面时滚动条的高度。 beforeLeaveTab(tab, event) { //参数tab是要进入的页面的唯一值，event是要离开的页面的唯一值。 let _this = this // 存滚动条位置 if (_this.$el.querySelector('.tableQh'
2021-04-08 11:23:14
1280
原创 elementUI中el-form和el-table互相嵌套，动态校验问题。
使用场景:在项目中要使用表格数据，当某一行数据处于勾选状态时，对改行某些数据进行校验。el-form el-table嵌套代码块重要代码对表格数据赋予动态prop，并控制只有数据处于勾选状态下才会校验该行。 <el-form-item :prop=" 'bpaData.Alternator.' + scope.$index + '.buslinename' " :rules="
2021-03-29 15:38:56
3089
原创 判断一个对象是否为空对象
let obj ={}首先直接判断obj=='{}'不行console.log(obj == '{}') //false1.JSON.stringifyconsole.log(JSON.stringify(obj) == '{}') //true2.Object.keys() console.log(Object.keys(obj).length === 0 ? '空' : '不为空')3.for …in循环function isobj(obj) { for (let i i
2021-03-16 15:33:31
132
原创 vue父组件调用子组件的表单验证方法
需求：父组件调用子组件的表单验证方法，验证成功，继续进行接下来的操作，验证失败，提示用户并返回。一、在父组件中引入子组件 <el-dialog :title="title" :visible.sync="dialogVisible" width="50%" :before-close="handleClose" > <exciter-edit ref="alternatorRef" /> <sp
2021-03-02 14:02:10
4545
原创 将类数组对象转换为数组
function list() { //两者皆可将类数组对象装换为数组 // return Array.prototype.slice.call(arguments); return [].slice.call(arguments)}var list1 = list(1, 2, 3); // [1, 2, 3]console.log(list1)console.log(Object.prototype.toString.call(list1)) // [object Array]
2021-02-23 10:25:45
201
转载 vue小记
何时适合侦听属性:虽然计算属性在大多数情况下更合适，但有时也需要一个自定义的侦听器。这就是为什么 Vue 通过 watch 选项提供了一个更通用的方法，来响应数据的变化。当需要在数据变化时执行异步或开销较大的操作时，这个方式是最有用的。<div id="watch-example"> <p> Ask a yes/no question: <input v-model="question"> </p> <p>{{ an
2021-02-20 09:44:39
168
原创 封装一个elementUI分页组件
一、封装的分页组件<template> <div :class="{ hidden: hidden }" class="pagination-container"> <el-pagination :background="background" :current-page.sync="currentPage" :page-size.sync="pageSize" :layout="layout" :pag
2021-02-05 13:52:28
149
原创 封装一个elementuI的table表格组件
一、封装的表格组件<template> <div> <el-row> <el-col :span="24"> <el-table :data="tableData" border v-loading="load"> <template v-for="(item, index) of table"> <!--if判断的是父组件传的表头是操作的id名
2021-02-05 10:24:47
514
原创 前端参数如何传null
eg如果要传一个null作为参数，就只写参数名，不写参数值就可以了。async checklegal() { const res = await this.$http.get('/busline/checklegal?id=', { params: { name: this.addGeneratrixForm.busLineName, voltage: this.addGeneratrixForm.busLineRateVoltage,
2021-02-03 16:52:43
4410
原创 vue watch监听对象属性
一、监听对象eg:data里面定义的对象； queryInfo: { model_type: '', name_key: '', bus_base: '', bus_base2: '', bus_name2: '', },watch监听监听对象的时候要在监听属性里面写上deep: true watch: { queryInfo: { handler: function (val,va
2021-02-03 15:54:18
362
原创 css鼠标移入显示移出隐藏
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>鼠标事件</title> <style> #imgId { width: 60px; height: 60px; display: block } #butId { float: right; border-radius: 4px; } </s
2021-01-22 14:08:35
2890
原创 前端项目将毫秒数转换为日期格式
方法一：在main.js里面注册全局过滤器1.在main.js里面注册全局过滤器Vue.filter('dateFormat', function (originVal) { const dt = new Date(originVal) const y = dt.getFullYear() const m = (dt.getMonth() + 1 + '').padStart(2, '0') const d = (dt.getDate() + '').padStart(2, '0')
2021-01-22 10:33:11
1367
原创 vue实现中英文的切换
原文链接1.下载插件npm install vue-i18n --save-dev2.创建中文文件(zh.js)和英文文件（创建目录src/com/language）//zh.jsmodule.exports = { language: { name: '中文' }, user: { LogOut: '退出登录', Rights: '权限管理', systemLog: '系统日志', }}//en
2021-01-22 10:00:58
707
原创 linux查看端口使用情况
lsof查看所有端口号lsof -i查看指定端口号lsof -i:8012netstat -tunlpnetstat -tunlp | grep 端口号或程序名称ps -ef |grep 程序名称
2021-01-13 17:54:43
221
原创 vue兄弟父子组件之间传值
一：父组件修改子组件的值1.在父组件中声明子组件import editstability from '../edit/editSimilarStability.vue'2.使用引入的子组件,可以通过 ref 这个 attribute 为子组件赋予一个 ID 引用 <editstability v-if="editVisible" ref="editVisibleRef" @alterGovernorSt="getData" >
2021-01-13 10:49:57
136
原创 elementUI的table组件实现全选功能
需求：最近碰见一个需求，有三万多条数据,用户点击全选按钮，要将三万条数据全部选中。template <el-checkbox v-model="datCheckAll" style="float: right" label="全选" v-show="activeName == 'dat'" :indeterminate="isIndeterminate" @change="handleCheckAll
2020-12-30 10:29:40
4605
原创 [warn] the “user“ directive makes sense only if the master process runs with super-user privileges
原文链接linux中启动nginx报错：[warn] the "user" directive makes sense only if the master process runs with super-user privileges, ignored in /usr/local/webserver/nginx/conf/nginx.conf:2解决方法:1.使用root用户登录linux2.进入…/nginx/sbin目录下3.执行代码chown root nginxchmod u+s
2020-12-21 10:55:15
5933
原创 nginx处理前端跨域
最近往服务器上布项目的时候出现了跨域问题，从网上查找了一圈资料，最终通过nginx解决了跨域问题。主要是配置nginx的nginx.conf文件其中listen是监听的端口号listen 8012;root是打包好的前端项目的位置location /{ root /home/dwaq/gzdwsjk; index index.html index.htm; }代理的路径，当接口中含有api时，会将请求发送至代理的接口 location
2020-12-04 16:15:33
219
原创 vue项目设置反向代理跨域
网上介绍vue设置反向代理的博客很多，方法也很多，我用的是在vue.config.js文件里进行设置，改文件和src文件夹同级代码如下：// vue.config.jsconst webpack = require('webpack')module.exports = { devServer: { proxy: { '/api': { target: 'http://192.168.20.220:8092',// 发送
2020-12-04 15:58:57
616
原创 登录页面用md5对用户密码进行加密处理
需求:当用户进行登录时，对用户密码用md5进行加密处理。下载MD5npm install md5 --save在页面引入md5import md5 from 'md5'密码输入框 <!-- 密码 --> <el-form-item prop="password" style="margin-bottom: 25px"> <el-input ref="password" show
2020-12-04 10:39:49
2586
原创 项目登录页面，后端生成验证码，前端显示问题
需求，项目中的登录页面用到了验证码，后端生成啦图片数据，前端调取接口获取数据，显示在页面template <el-form-item prop="code"> <el-input ref="code" prefix-icon="el-icon-document-checked" clearable placeholder="验证码" v-m
2020-12-04 09:57:35
1694
原创 elementUI中表格翻页后保持记忆功能
需求：在当前也勾选表格某一行之后，当再次跳转回该页面之后，原来已经勾选了的还保持选中状态一 table树形添加row-key="id" <el-table border :data="treeTableData" row-key="id" ref="multipleTable" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }" style="
2020-12-01 14:29:43
691
原创 JavaScript对单个或多个 数组去重
eg:let arr = [1,2,3,2,3,2,1,3]console.log(Array.from(new Set(arr)))VM86705:1 (3) [1, 2, 3]
2020-12-01 14:22:17
126
原创 实现elementUI的表格组件只能同时选中一行，且不可以全选
需求：表格组件只可以同时选中一行，若已有某一行被选中，则再次点击其他行时，已选中的当前行变为未选中状态。实现只可以选中一行template <el-table height="94.8%" ref="multipleTable1" type="index" border style="width: 96%; border-bottom: 1px solid black" :da
2020-11-24 08:38:38
2231
1
原创 vue项目post请求中携带‘Content-Type‘: ‘application/json；charset=UTF-8‘
今天使用post方法向后端请求数据，始终不成功，最后在方法请求头中加上 ‘Content-Type’: ‘application/json;charset=UTF-8’，请求成功 async bpaParams() { const res = await this.$http.post( '/acline/datbpagenerate', JSON.stringify(data), { headers: {
2020-11-18 15:02:11
9245
原创 前端下载时传递参数将参数拼接在接口（url）后面传递给后端
需求：常见的传递参数都是将参数写在花括号里面，但是有时候花括号并不适合，可以选择将参数拼接到接口后面let url = this.paramConfig.httpPath + '/basedata/download?baseDataID=' + ss.join(',') + '&Area=' + window.sessionStorage.getItem('userArea')完整的代码如下，实
2020-11-09 11:56:01
3508
1
原创 echarts地图，拖动地图实时获取鼠标处的经纬度、当前放大倍数等信息
注册地图 var myChart = echarts.init(document.getElementById('viewChart')) echarts.registerMap('guizhou', guizhou)监听鼠标拖动事件 myChart.on('georoam', function (params) { console.log(myChart.getOption().geo) //地图中的信息，包括经纬度、缩放大小等 })监听鼠标点击事件 myChart.on('c
2020-10-23 15:20:32
2137
原创 vue+elementuI 解决页面跳转后table表格最后一行边框线显示不全问题
overflow属性为hidden时，最后一行显示不全 .el-table { overflow: hidden;} overflow属性为auto时，最后一行可以显示.el-table { overflow: auto;}
2020-09-25 11:04:27
4333
1
原创 Vue+elementUI+upload 点击按钮弹出弹框，在弹框中有两个按钮，点击下载按钮进行下载功能，点击上传进行上传文件功能
需求分析：点击按钮会弹出一个弹框，弹框中有两个按钮，点击下载按钮进行下载，点击上传按钮进行文件上传。ps:功能看着可能有点多 ，其实分析一下很简单，首先 点击按钮弹出弹框，在弹框中有一个按钮和一个upload组件，点击下载按钮则关闭弹窗调用方法进行下载，点击上传则走upload组件的功能。template <el-button class="elbutton" style="width:100%" type="pr
2020-09-12 17:50:28
3864
原创 vue-element-upload 文件上传打开选择文件弹框前进行提示或操作
需求分析：在使用elementUI中的上传组件时，点击上传按钮就会立即打开文件弹框，有时候不想让文件弹框立即打开，而是点击按钮后先进行其他的判断，若符合情况再打开文件弹框。方法一原文链接方法二template<div id="app"> <el-upload class="upload-demo" action="https://jsonplaceholder.typicode.com/posts/"
2020-09-12 17:04:50
8901
2
转载 elementUI中table表格，带选择框，默认勾选指定的数据
需求场景：table表格，第一列为选择框，默认某几行数据为选中状态。原文链接template <el-table :data="roleData" border stripe height="260" style="margin:20px 0" ref="docTable" @select="(selection,row)=>{selectHandle(selection,row
2020-09-10 23:19:05
5010
3
原创 elementUI中的table表格，带选择框，点击选中选择框，获取当前行id，存储数组若没有当前id，存进数组，再次点击，取消选中，从存储数组中删除id
需求场景：一个表格中有几十条数据，每一行代表一条，表格第一列是选择框，当点击某一行的选择框，选中此条数据，将此条数据的id存进存储数组，若点击取消选中状态，则将该条数据对应id从存储数组中删除。template代码 <el-table :data="roleData" style="margin:15px 0" border stripe height="260" @select="(selection,row)=
2020-09-10 21:56:31
2324
3
原创 elementUI动态切换校验规则且切换校验规则时清空上一次校验产生的警告文字
**this.$refs.transformerForm.clearValidate(['transformerLVSRateCapacity'])**清除切换校验时上一次校验留下的警告文字，<el-form :model="transfomerInfo" :rules="rules" ref="transformerForm" label-width="170px"> <el-form-item label="低压侧容量(MVA):" prop="transformer...
2020-09-03 18:34:16
1672
原创 rabbitmq小记
channel.assertQueue('', { exclusive: true }声明一个队列，该队列在连接关闭时会被自动删除，当交换机类型为*fnout*时多应用此类型队列
2020-03-10 17:01:02
198
原创 vue中post请求报400的错误
首先上图出现了400错误，一般是前后端交互的方法参数不一致，发生此错误需要仔细检查前端传递的参数数据的参数名、参数数目、参数类型是否与后端保持一致。我看了我提交的参数和路径，和后台都一样，而且用ostman可以获取到数据，但在项目中获取不到，这是我开始的请求方法查资料得知axios默认使用application/json格式来提交数据的，而Postman请求格式是application/x...
2020-02-27 13:44:36
7686
6
原创 eslint验证末尾有分号，字符串单引号与vscode格式化文档冲突
在项目根目录下面创建 .prettierrc 文件，写入{“semi”:false,“singleQuote”:true}
2020-02-20 23:44:29
1398
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人