ES6
周家大小姐.
这个作者很懒,什么都没留下…
展开
-
vue 子页面监听vuex变化第一次发触发但是变化后不会监听只有手动刷新页面后才会有变化
有一个需求就是对每个用户的操作进行保存,我把数据存在vuex中,奇怪的是watch监听一开始是有变化的;但是数据改变后页面却监听不到,只能手动刷新页面数据才会实时监听到变化html:页面存储 this.$store.dispatch('videoMonitorSystem/getUserInfoVideo', { data: params })下面看错误代码"/* * @Author: your name * @Date: 2022-04-28 11:15:44 * @La原创 2022-05-07 10:48:40 · 1763 阅读 · 0 评论 -
es6 js 匹配两个数组对象
判断两个数组用的value是否相等 this.list = [ { user_type: 0, user_id: 1003, department_id: 1, department_name: "公司xx", mobile: "", realname: "廖xx", com_nam原创 2022-03-28 15:21:45 · 1233 阅读 · 0 评论 -
递归斐波那契数列重量执行次数高用动态规划(存储)解决
重复效果图,发现同一个次会执行两次 let counter = 0; function fib(n, memo) { let result;//存储中间值 counter++ if (memo[n]) return memo[n]//难这个中间值是否存在,如果存在就返回结果 if (n === 0 || n === 1) { result = 1原创 2021-11-13 14:40:43 · 441 阅读 · 0 评论 -
vue computed计算属性对传入的px值进行rem计算并赋值
父组件: <yg-table-header :labelWidth="'84'" :list="searchList" @search="onSubmit"/>子组件: <label class="yg-header-span-label" :style="[setLabelStyle,setLabelWidth]">{{item.label}}{{ showSymbol ? ':' : ''}}</label> props: { labelWid.原创 2021-10-14 13:42:47 · 277 阅读 · 0 评论 -
2021-10-09 vue+element实现computed计算属性缓存
需求:如果有7,所以标签去掉,如果没有7就看有没有6,如果有6,对应6的这条数据标签为待审批,其它为空(5以上的数字数据)如果没有6就走5 <div v-for="(item, idx) in xklist" :key="idx" style="padding-top: 20px" class="border"> <div class="status" style="background-color: #e77628">原创 2021-10-09 13:39:32 · 274 阅读 · 0 评论 -
vue原生button多个复选框选中及反选改变背景色
<template> <div> <!-- 多选,反选取消 --> <button @click="handleBtn(i)" v-for="(item,i) in list" :key="i" :class="checkList.indexOf(i) === -1 ? '' : 'active'">{{item.name}}</button> </div></template><sc.原创 2021-09-21 16:14:45 · 1024 阅读 · 0 评论 -
vue+element实现下拉菜单并带本地搜索功能
需求:后台返回数组对像,前端组合成数组,根据name组合成一个个数组并把后台返回的值当成一个children推入数组,在数组中自定义属性备份数据防止搜索的时候改变原数组使得数组无法回退这里是用的vuex存储,因为多个页面使用同一个接口;所以没必要重复请请求src\store\module\metadata.js/* * @Author: your name * @Date: 2021-09-02 15:46:45 * @LastEditTime: 2021-09-16 17:39:53原创 2021-09-16 17:46:09 · 1379 阅读 · 0 评论 -
vue+element el-carousel轮播图,十条数组成一个轮播图,
<el-carousel direction="vertical" :autoplay="true" indicator-position="none" :interval='5000'> <el-carousel-item v-for="(list,index) in newDynamicList" :key="index" class="dynamic-item"> <div class="item-img flex" v-for="(it...原创 2021-08-19 15:59:30 · 2005 阅读 · 2 评论 -
vue+element 当el-table中使用el-checkbox全选视图不更新解决方法
加一个key就好了;代码:<template> <div> <el-form :model="ruleForm" :rules="rules" key="ruleForm" ref="ruleForm" label-width="130px"> <el-row> <el-col :span="8"> <el-form-.原创 2021-08-18 10:27:13 · 2739 阅读 · 0 评论 -
vue+element el-date-picker日期选择器限制选择近1年内(365天)日期并只能选择从开始日期到结束日期为一个月的日期
话不多说,上代码: <el-date-picker :picker-options="setEndTime" @change="signDateChange" v-model="data.date" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" class="date"> </el-date-picker>js: data() { retur...原创 2021-08-11 16:16:14 · 4533 阅读 · 0 评论 -
es6,js 数组截取并保留原数组
const timeData = ['2021/8/5', '2021/8/6', '2021/8/7', '2021/8/8', '2021/8/9', '2021/8/10', '2021/8/11'] const timeDatax = timeData.map((item) => item.slice(5)) console.log('timeDatax', timeDatax) console.log('tim...原创 2021-08-10 15:14:46 · 2393 阅读 · 0 评论 -
vue el-form同时对多个表单进行验证 activated
看代码,因为我这是步骤条;可能和常规的有点不一样;大家根据需求改就可以resetFields,clearValidate清空和重置为二选一,所以不能同时使用<!-- * @Author: your name * @Date: 2021-08-03 15:25:06 * @LastEditTime: 2021-08-04 11:23:07 * @LastEditors: Please set LastEditors * @Description: In User Settings E.原创 2021-08-04 11:24:32 · 1392 阅读 · 0 评论 -
Object.assign深拷贝和浅拷贝
let obj1={ a:{ b:1 }, c:2 } let obj2=Object.assign({},obj1) obj2.a.b=3 obj2.c=3 console.log(obj1)/**浅拷贝a:{b:3},c:2 */ console.log(obj2)/**浅拷贝a:{b:3},c:3 */原创 2021-06-06 23:08:29 · 201 阅读 · 1 评论 -
vue 嵌入iframe页面,获取iframe元素修改样式
<template> <div class="workbench-container"> <div v-if="idDev" style="width:100%;height:100px"> <div style="margin-left:-162px;margin-top:-90px;"> <iframe id="iFrame" ref="iframes" .原创 2021-03-25 11:18:43 · 11474 阅读 · 10 评论 -
vue 获取当前url地址加端口号
location.protocol + '//' + location.host + '/portal/ztzx_workbench'原创 2021-03-19 13:59:49 · 4382 阅读 · 0 评论 -
vuex sotre请求阻止重复请求
为防止每次进行相同的请求我们可以先判断state中有没有该值如果有就直接赋值没有就重新请求const state = { userNames: {},}const mutations = { INSERT_USER_NAME: (state, val) => { state.userNames[val.code] = val.name },}const actions = { // 根据userCode获取userName getUserNameByU原创 2021-03-15 14:32:48 · 526 阅读 · 0 评论 -
js es6判断数组中出现最多的重复元素并打印出次数及元素值
三种方法:数组样式 : mounted () { let a = [1, 2, 8] let b = [1, 8] let c = [1, 4, 8, 7, 8] let d = a.concat(b, c) this.GetArrayMost(d) },一种方法methods: { // new Map 去重并打印出现复生次数最多的 GetArrayMost (arr) { var arrMap = ne.原创 2021-03-13 17:07:19 · 3360 阅读 · 0 评论 -
vue axios CancelToken 取消频繁发送请求的用法
需求:input框搜索姓名,如果一直获取焦点太快的话;上一个请求pending状态;下一个请求就发出来了,如果数据量小还好,数据量大时,旧的请求依旧没有停止,这将会十分损耗性能,这时我们应该先取消掉之前还没有获得相应的请求解决:用axios用自带的方法对象来进行取消和使用:data中定义属性变量方便方法调用 <div class="control-item"> <div class="left"> <span&原创 2021-02-25 14:19:42 · 778 阅读 · 1 评论 -
vue 请求头中headers加参数
两种方法:一加在请求中如://自定义的前缀和router请求import settings from '@/settings'import request from '@/utils/commissioner_request'export function queryConfigValue(userCode, comId) { return request({ url: settings.servicePrefix + 'queryConfigValue', metho原创 2021-02-22 15:28:17 · 19506 阅读 · 0 评论 -
js/es6判断对象是否为空,并判断对象是否包含某个属性
hasOwnProperty:对象.hasOwnProperty(属性名)(判断对象中是否含有某个属性名,返回一个布尔值) getLifeInsBranchByCommissioner(params).then(res => { console.log('res获取专员负责的寿险机构接口', res) const data = res.hasOwnProperty('data') console.log('data', data)原创 2021-02-22 15:07:37 · 820 阅读 · 0 评论 -
vue elmentUi el-tooltip组件超15个字隐藏悬浮时出现所有字节
需求:hover时展示所有内容,离开时只显示15个字节以内的内容这里为一个组件,props中的内容需要父组件传值子组件:src\components\TooltipLimit\index.vue<template> <!-- 提示语超过15个字限制显示 --> <div style="cursor: pointer;"> <el-tooltip class="item" effect="dark" ..原创 2021-02-03 14:37:07 · 971 阅读 · 0 评论 -
for循环终止方法
for(let i=0;i<10;i++){ if(i==4)break; console.log(i); }原创 2021-01-26 16:59:49 · 7805 阅读 · 0 评论 -
vue 下载xlsx或xls表格
需求:后台没有提供下载接口,就只能下载插件调用查询接口,把查询出来的数据通过插件生成xlsx或xls表格导出来对应插件:npm install --save xlsx-stylenpm install file-saver --save创建一个文件export2Excel.js/* eslint-disable */import { saveAs } from 'file-saver'import XLSX from 'xlsx-style'function dataNum原创 2020-12-16 10:24:39 · 755 阅读 · 0 评论 -
el-checkbox 获取选中的所有数组值,或从选中当中删除已选的数组
我这里有三个数组所以看起来复杂点;需求:点击的时候把所选中的复选框中的id,val,label组成一个数组,点保存的时候要把所选中的所有值传给后台 <el-checkbox-group v-if="showModule=='riskClass'" v-model="exceptRiskList"> <el-checkbox v-for="item in riskClassOptions" :key="item.classCode" :label="it.原创 2020-12-02 16:35:37 · 5483 阅读 · 0 评论 -
vue element 时间选择开始时间不能大于结束时间
html:el-date-picker选择器:picker-options="startTime":picker-options="endTime"为禁止选择逻辑 <div class="control-item"> <div class="left"> <span class="sale-require-star-text">起保日期</span> </div> ..原创 2020-11-04 12:15:12 · 2522 阅读 · 0 评论 -
vue 根据每个用户的自定义表格设置进行本地存储,当本地没有存储过请求接口
因为多个页面使用,所以写一个mixin文件JSON.parse(localStorage.getItem(`${userInfo.userCode}_theme_config`))userInfo.userCode可以对每个用户进行动态存储/** * 用户个性化配置 */export const personalThemeConfigMixin = { methods: { // 获取 getThemeConfigOfKey(key) { retu原创 2020-11-02 10:09:28 · 483 阅读 · 0 评论 -
vue 定义axios默认路径前缀或动态修改前缀
如:每个请求url前都要加一个前缀,但会根据开发环境不同而变化,那么我们可以写一个方法去引用,方便后面维护.env.development开发文件中写入要用的服务编码# 微服务编码VUE_APP_SERVICE_PREFIX = '/0201040201'src/settings.js新建的settings文件中引入module.exports = { /** * 主站标题 * @type {string} */ title: '开发项目名称', /..原创 2020-11-02 09:58:26 · 3574 阅读 · 0 评论 -
vue directive全局自定义指定控制元素的显示和隐藏
创建src\directive\auth\index.js文件import store from '@/store'const auth= { inserted(el,binding,vnode,oldVnode){ let user = window.sessionStorage.getItem('user') user = user ? JSON.parse(user) : {} // 如果角色为管理员就不验证 if(!user.super){ let rules =原创 2020-10-23 10:51:14 · 2201 阅读 · 0 评论 -
vue pdf下载
<el-table-column label="保单号" show-overflow-tooltip min-width="220"> <template slot-scope="scope"> <span>{{ scope.row.policyNoCI }}</span> <span v-if="scope.row.policyNoCI" :key="sco..原创 2020-10-14 12:19:22 · 537 阅读 · 0 评论 -
vue 后台返回base64位表格数据axios文件下载处理方法
数据返回样式:因为是64位所以这里会这样显示 <div class="sale-m-t-16"> <el-button class="sale-button-addon" icon="el-icon-download" style="margin-left: 10px" type="primary" round plain .原创 2020-10-14 12:26:04 · 601 阅读 · 0 评论 -
vue 文件上传方法formData
html: <el-upload ref="upload" drag action="" class="uploader" accept=".xls,.xlsx" :multiple="false" :on-change="handleChange" :on-remove原创 2020-10-13 17:31:26 · 3970 阅读 · 0 评论 -
js 日期格式兼容及转换
index.js/** * Parse the time to string * @param {(Object|string|number)} time * @param {string} cFormat * @returns {string | null} */export function parseTime(time, cFormat = '{y}-{m}-{d} {h}:{i}:{s}') { if (arguments.length === 0) { return原创 2020-09-23 14:52:44 · 440 阅读 · 0 评论 -
js 保留两位小数,自动补充零(0除外)
index.jsexport function reserveDecimal(value) { let val = Math.round(parseFloat(value) * 100) / 100 const xsd = val.toString().split('.') if (xsd.length === 1) { if (+value !== 0) { val = val.toString() + '.00' return val } el.原创 2020-09-23 14:09:12 · 1049 阅读 · 0 评论 -
js 阶乘递归
function fact(number) { if (number === 1) return 1//出口,不然会进入死循环 return number * fact(number - 1) } console.log(fact(3))//6 console.log(fact(6))//720原创 2020-09-13 15:59:13 · 481 阅读 · 0 评论 -
js获取斐波那契数列中下列为n的元素
斐波那契数列的规则是第三个数为前两个数的和 function fib(n) { const numbers = [1, 1]//初始前两个数为默认,所以从2开始,n+1是因为要获取最到一个数,我们的数组是从下标开始的 for (let i = 2; i < n + 1; i++) { numbers.push(numbers[i - 2] + numbers[i - 1]) }...原创 2020-09-05 16:26:47 · 361 阅读 · 0 评论 -
js 求和
// 求和 function sumUp(n) { // 如 100==>(100/2)==50*(10+1)==101 return (n / 2) * (n + 1) } console.log(sumUp(100)); //5050原创 2020-09-02 20:36:23 · 368 阅读 · 0 评论 -
js scrollToTopd页面滚动至顶部
const scrollToTop = () => { const t = document.documentElement.scrollTop || document.body.scrollTop if (t > 0) { window.requestAnimationFrame(scrollToTop) window.scrollTo(0, t - t / 8) } } co...原创 2020-08-20 16:10:35 · 1387 阅读 · 0 评论 -
js 计算两个日期之间以天为单位的差值
计算两个日期之前的天数差值 const getDayDiff = (date1, date2) => (date2 - date1) / (1000 * 3600 * 24) const diff = getDayDiff(new Date('2020-08-01'), new Date('2020-08-03')) console.log(diff)//2原创 2020-08-20 16:07:44 · 464 阅读 · 0 评论 -
vue+element 判断table表格输入不能为空
如:一个按钮添加属性,插入table表格中有,点击确定的时候判断其中某行不能为空 <el-table :data="value_list" style="width: 100%"> <el-table-column prop="order" label="排序" width="80"> <template slot-scope="scope"> <el-input v-model="sco原创 2020-07-26 22:19:24 · 6497 阅读 · 0 评论 -
localStorage push数组并去重
// 选择关键字 handleKeyword(item) { const keyword = [] keyword.push({ ...item, code: '{' + item.code + '}' }) const getLocalexample = JSON.parse(localStorage.getItem('example')) if (getLoca...原创 2020-06-24 15:45:30 · 816 阅读 · 0 评论