buukyjmvni的博客

原创 DateTimePicker 日期时间选择器 限时时间范围 精确到时分秒

elementui 日期时间选择器 限制时间范围精确到时分秒

原创 js两个小数相加

【代码】js两个小数相加。

原创 前端js 数字金额转换为记账格式 金额格式化

【代码】前端js 数字金额转换为记账格式 金额格式化。

原创 element-ui修改主题颜色

elementui修改主题颜色

原创 vue 前端根据url在线预览pdf、docx、xlsx、txt、html文件

在线预览pdf docx xlsx txt html 文件

原创 谷歌浏览器安装vue工具 devtools

1、官网下载压缩包，或者直接克隆，这里我采用的是克隆git clone https://github.com/vuejs/vue-devtools.git2、直接在终端yarn install安装依赖ps（注：识别不了yarn命令的先用npm安装yarn ==>npm install -g yarn ）pps（如果识别不了npm 请去先把node安装了）3、继续输入命令yarn run build4、在克隆项目的这个文件夹里找到packages，里面有一个shell-chrome，

原创 vue element-ui el-table 表头筛选 配合接口数据渲染/以及多个筛选条件的情况

一、table设置监听事件（@filter-change）、想要筛选的列设置过滤条件（:filters） <el-table :data="columns" border @filter-change="filterHandler" //监听事件 style="width: 100%" max-height="500" :row-style="{ heig

原创 vue elementui 中——el-popover、el-tree 树选择框的使用

一、html部分 <el-popover placement="bottom" title="特征选择" width="620" trigger="click" > <el-tree ref="tree" :data="datasetFilterList" //绑定数据 show-checkbox

原创 vue 父子组件传值

一、父向子传值 示例//父组件内容<el-tab-pane name="ParamSampling" label="数据采样"> <ParamSampling :tab='activeName'></ParamSampling> //这是子组件接收tab的形式</el-tab-pane>data(){ return{ activeName: sessionStorage.getItem('tab') |

原创 js为对象添加动态的属性名

一、需求：obj = { “张三” : [ ] , “李四” : [ ]} //属性名不确定二、实现 var cols = {} var valid = {} //创建两个空对象 this.inputList.forEach((e,index)=>{ //将需要解析的数据循环赋值给cols和valid属性名 cols[`${e.dsId}`] = [] valid[`${e.dsId}`] =

原创 vue el-table表格根据获取的数据动态合并行

1、需求：根据表格第一列的内容判断，值相等则将第一列的这些行合并成同一行2、效果：3、实现方法：1、为table设置 :span-method方法<el-table :data="data" :span-method="objectSpanMethod" //method style="width: 100%;" max-height="500"

原创 vue elementui checkbox多选框功能

一、在选择框上方添加一个多选//增加的 <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange" class="fla" >全选</el-checkbox > //以下是被选择的数据

原创 vue前端 antv/G6 根据后台返回的数据 绘制二叉树

一、npm安装npm install --save @antv/g6二、相应位置引入import G6 from '@antv/g6';三、后台传回的数据示例Array(2) //两棵树 0: feature: (...) feature_party: (...) left: Object //左子树 right: Object //右子树 子树的结构和0一样，有左右子树，直到叶子结点 w: (...)四、方法：（重点）1、渲染数据 xgbForE

原创 vue element-ui 中select选择器多选功能

多选功能根据elementui官方写法就没问题，很简单在这里记录一下在项目中遇到了一个bug⬇️在进行多选时，取消多选后再次点击刚刚取消的选项，出现了两个相同的tag，报id重复错误；但是直接点tag上的小叉叉再添加，就不会重复出现。检查了一遍又一遍，发现在选择器上绑定了一个@removeTag，写了一个删除tag的方法，而@change方法里的一通逻辑，并没有删除这一动作，于是添加逻辑：一、选择器内：<el-form-item label="" > <el-

原创 vue前端-时间戳转换成日期格式/日期转换成时间戳

一、日期转换成时间戳new Date().getTime() //当前时间 变成时间戳 new Date(res.data.beginTime).getTime() //获取到的时间转化成时间格式，再变成时间戳二、时间戳转换成日期格式1、安装npm install moment --save2、main.js注入import moment from 'moment'Vue.filter('dateFormat',(value,pattern = 'YYYY-MM-DD HH:mm:s

原创 vue调用后台接口下载文件功能

一、接口处export const downResultPdf = (id) => { return request({ url: `/executionResult/downloadPdf/${id}`, method: 'get', headers: { 'Content-Type': 'application/x-www-form-urlencoded', //请求头 根据实际接口文档内容填写 }, responseType: 'blo

原创 前端滚动分页加载：vue-infinite-scroll

一、展示loading…的div块 <div v-infinite-scroll="loadMore" v-show="loading" infinite-scroll-disabled="busy" infinite-scroll-distance="30" style="text-align:center;margin:30px"> LOADING..... </div>二、data busy: true , loading: t

原创 elementui侧边栏菜单刷新后不被选中、不高亮的问题

在sidebar.vue文件里，一、elmenu组件中设置default-active：<el-menu :show-timeout="200" :default-active="activerouter" //重点 :collapse="isCollapse" :default-openeds="openeds" background-color="#FFFFFF" text-color="#000000" ac

原创 el-radio选择器将所选的数据回显

利用v-model和label确定，为1时表示被选择；<div v-for="(item,key) in Algorithm" :key="key" class="select"> <div class="select-small"><el-radio v-model="item.status" label="1" disabled>{{ item.name }}</el-radio></div> </d

原创 el-table中的点击展开与折叠/手风琴

效果如图：1、为按钮设置点击事件传参2、方法toogleExpand(row) { const $table = this.$refs.table; this.tableData.map((item) => { console.log('1',item) if (row.performId != item.performId) { $table.toggleRowExpansion(item, false)

原创 Vue中鼠标悬停更换图片/文字内容，动态展示/修改某些属性

Vue中鼠标悬停更换图片/文字内容，动态展示/修改某些属性鼠标悬停时：@mouseenter 鼠标离开时：@mouseleave利用以上来绑定相应方法，例如：<div @click="finance" @mouseleave="changeImageSrc(1, '')" @mouseenter="changeImageSrc(1, 'hover')"> //分别为鼠标悬停时和离开时绑定方法changeImageSrc，并传递参数 <img :src="ci

原创 vue中输入框无法输入——原因：绑定的对象未找到——为对象添加新属性的方法

一、出现input无法输入的情况，即v-model绑定的对象未找到二、如果需求是input须绑定一个当前并不存在的对象属性，那么需要新创建：代码：mounted(){ let data = JSON.parse(window.localStorage.getItem('columns')) for (const key in this.tableData ) { this.tableData[key].columnDefaultVa

原创 vue调用高德地图实现点击地图获取地点

一、获取key（百度）二、main.js中挂载三、页面使用 <div class="amap-page-container"> <el-amap-search-box :search-option="searchOption" :on-search-result="onSearchResult" class="search-box" /> <el-amap ref="m

原创 vue中利用setInterval进行轮询调用及如何利用clearInterval停止轮询

之前因为接口返回数据有延迟，首先是返回null，过几秒才会返回真实数据。所以做了个两秒的轮询调用，轮询成功了但是根本停不下来哈哈哈哈，控制台疯狂打印…查了资料发现我的 clearInterval()用得不对，怪不得停不下来。这里记录一下。首先setInterval需要赋给一个变量，随便在本地return里设置一个a：然后通过条件判定轮询停止，clearInterval()的时候，直接停止a就好了：每天记录一个弱智小问题????...

原创 element时间选择器限制选择在一个月以内

原创 vue中axios调用后台下载功能接口

vue中axios调用后台下载功能接口