自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(104)
  • 资源 (13)
  • 收藏
  • 关注

原创 解决vue element-UI el-table组件实现翻页多选之后,table数据改变之前的选择不清空的问题

element-ui文档已经说得很清楚,要实现翻页勾选,就要牺牲掉"数据改变选项清空的优点"这样只能当数据改变(发送请求)之后手动去清空选项了element-ui依然友好的给我们提供了api用法如下:1. 加ref<el-table ref="table" :data="tableData" @selection-change="handleSelectionChange">>2.在需要的地方(一般是会改变tableData的地方)清空选项,本例是在按条件..

2021-01-14 17:30:49 25

原创 vue+ts 装饰器mounted/created等不执行

解决方案:需要引入component模块,此时,mounted才会执行(注意是在export外面)因为 @Component 修饰符注明了此类为一个 Vue 组件import { Vue, Component } from 'vue-property-decorator' @Component export default class inviteDocSign extends Vue { mounted() { console.log('mo

2021-01-14 14:03:04 7

原创 CSS标题在左侧列的table

不要想复杂了,其实就是不需要tr了 所有的都是td 然后给奇数列或者偶数列加样式即可。html:<div class="table-wrapper"> <table class="main-table" cellspacing="0" cellpadding="0"> <tr> <td>业务类型:</td> <td>{{ detailData.bizType

2021-01-11 09:58:46 6

原创 element-ui table组件 el-table-column宽度和对应位置总结

以三列为例1. 如果都不设置width则是平分宽度<el-table-column prop="name" label="礼品名称"></el-table-column><el-table-column prop="priceRange" label="单价(元)" ></el-table-column><el-table-column prop="num" label="库存数量"></el-table-column>

2021-01-04 10:16:11 33

原创 解决 Element-UI el-select多选以collapse-tags展示时,超过显示长度溢出的问题

问题如下:想让其超过显示长度的内容以"..."省略号显示 ,且加号和选项在一行显示解决办法:/deep/.fin-select__tags-text { display: inline-block; //根据自己的需要调整文字宽度 max-width: 45px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; }//根据自己需要调整叉号的位置/deep

2020-12-29 13:52:37 157

原创 element-ui el-input “type=number“的上下箭头去掉改造成加减按钮

项目中要用到数量的增加,但同时又想实时监听数值的变化,el-input-number样式满足,但无法监听input事件,watch也没法拿到实时的数值遂用el-input去模拟el-input-number的样式 <el-form-item label="申请数量" "> <el-input @input="((val)=>{handleNumChange(val,index)})" type="number" v-model="item.num"> &

2020-12-28 16:07:39 141

原创 代码验证flex:1与flex-grow:1的区别与计算方式

1. flex的宽度计算方式是分配 "容器剩余空间+具有flex属性的元素自身尺寸":举例:在一个width:400px的容器中,有a、b、c 三个width:100px的元素,给a元素flex:2的属性,给b元素flex:1的属性,不给c元素。计算宽度的规则是:(1)容器剩余空间400px-300px = 100px (2)参具有flex属性的元素自身尺寸100px+100px = 200px(3)求和100px+200px = 300px把这300px按2:1的比例分给a和b ,最后:a:wid.

2020-12-22 16:46:56 11

原创 解决vue get方式传参参数中有数组的问题

项目需求:get 方式传参,参数中有数组,依然想保持key1=value1&key2=value2的方式向后端传递解决办法:qs.stringify(this.cond, { arrayFormat: 'repeat' })形成的链接效果如下:/api/apporAgentDefinition/download?current=1&pageSize=10&departList=0001&apporDepend=&creatorUsername.

2020-12-21 17:24:17 50

原创 Vue element-ui form表单验证单价价格 input只允许输入保留两位小数的数字

需求:只允许用户输入保留两位小数的单价,且加上小数点不超过10个字符1.html <el-form-item label="单价(元)" prop="price"> <el-input :disabled="isEdit" v-model="ruleForm.price" placeholder="请输入保留两位小数的单价" oninput="value=value.replace(/[^0-9.]/g,'')"></el-input> </el-

2020-12-18 16:43:04 164 1

原创 cookie sessionStorage和localStorage的应用场景区别

1. 生命周期:cookie:可设置失效时间,没有设置的话,默认是关闭浏览器后失效localStorage:除非被手动清除,否则将会永久保存。sessionStorage: 仅在当前网页会话下有效,关闭页面或浏览器后就会被清除。2.存放数据大小:cookie:4KB左右localStorage和sessionStorage:可以保存5MB的信息。3. 应用场景:cookie:由于其大小受限、每次访问都要传送cookie给服务器,浪费带宽以及storage在存储数据的大小上面.

2020-12-15 11:14:55 10

原创 JS空数组空对象,负值转成布尔值时都为true,非值为false

var a = []; console.log(!a); //false var b = {} console.log(!b); //false var c = -1 console.log(!c); // false

2020-12-11 16:31:09 29

原创 解决elementUi中的table组件筛选表格默认筛选filtered-value没效果,表格数据渲染不出来的问题

项目中遇到一个问题想要的效果如下:但是实际进入该页面的时候必须刷新一下才会显示默认筛选的效果和数据,遇到的问题如下:数据请求没有问题,但是tabledata总是加载不出来问题代码如下: <el-table-column column-key="name" prop="name" :label="filterLabel" width="200" .

2020-12-11 14:47:50 121

原创 element-ui 选择组件 el-select远程搜索功能,实现对输入内容和长度的限制

需求如下:远程搜索select限制搜索内容输入的长度方法一:加了id选择器,实测el-select加class类选择器并不能够渲染出来,加了也是无效的。html: <el-form-item label="礼品名称" prop="name" > <el-select id="giftNameLimit" v-model="query.name"

2020-12-09 16:04:04 193

原创 JS构造函数加new与不加new的区别?

前端面试的时候经常会被问到一个问题:new的过程中,发生了什么?先来看js红宝书(js高级程序设计第三版)给出的答案:1.创建一个空对象2.将这个空对象的原型,指向构造函数的prototype属性,构造函数中的this指向这个空对象3.开始执行内部的代码。4.如果该函数没有返回对象,则返回this很多人只是把它背下来,并没有真正的理解,不信的话看一下这个面试题:填写"TO DO"处的内容让下面代码支持a.name = "name1"; b.name = "name2";func.

2020-12-07 14:20:49 41

原创 在一个元素上:hover悬停,改变另一个元素的属性样式

1. 二者是父子关系.father:hover .son { color:red; }2. 二者是兄弟关系.brother1:hover+.brother2 { color:red; }3. 二者是兄弟的儿子关系 .brother1 .brother1Son:hover+.brother2 { color:red;}.

2020-12-04 13:50:56 28

原创 vue动态获取改变data中的属性值以及解决expression of type ‘string’ can’t be used to index type的问题

1. 动态使用属性方法属性和方法调用方式一样 this[test]//test可以是属性名也可以是方法名2. 解决如题目所示报错报错的意思是string类型不能作为index解决办法:在组件文件中声明如下:<script lang="ts">declare module 'vue/types/vue' { interface Vue { [key: string]: any; }}</script>至此,问题解决。...

2020-11-30 14:48:50 53

原创 解决问题Could not find a declaration file for module ‘*.js‘ implicitly has an ‘any‘ type.

vue ts项目中直接引入了js文件,控制台遂报了如标题所示错误虽然不影响项目启动, 但强迫症无法接受解决办法是在'*.d.ts'文件中声明,网上给到的解决办法都是在任意新建的或者已有的 '任意名字.d.ts' 文件中声明即可但我遇到的问题是:我们中已有如下三个.d.ts文件我试着在以上三个的任意一个中加入如下声明:declare module '*.js'结果只有在shims-vue.d.ts中是有效的,控制台不会报错接着又试了新建任意名.d.ts文件,仍然会..

2020-11-30 14:33:12 940

原创 git 版本回退或者撤销上一次pull操作

项目中由于代码冲突原因经常需要回退到某一个版本、或者pull拉了别人的代码,想取消pull二者的解决办法一致,遂记录:1. 查看历史变更记录,包括自己commit的以及pull别人的git reflog2. 回退到你想要的版本以编码1462729版本为例:git reset --hard 1462729...

2020-11-30 14:10:54 210

原创 解决 element-ui el-table表格组件先显示暂无数据 之后再加载数据的问题

项目中的表头和内容都是动态请求生成的,延时更久就会出现先闪一下(比闪一下更久)暂无数据,再显示正常界面的问题,用户体验会比较差。解决办法:动态定义tablelist为空时候展示的内容,没有请求到数据之前显示为空,请求到数据但是数据本身就是空的再显示"暂无数据"Table组件:<el-table :data="tableLists"> <!--增加内容--> <template slot="empty"> <p>

2020-11-30 10:44:18 227

原创 margin-top负值时和margin-bottom的区别

相信能看到这篇文章的都是跟我一样脑子时不时糊了的现记录如下,防止以后再糊住在CSS常用的垂直居中的方法中其中有一个方法就是利用了margin-top代码如下: <style> html,body { width: 100%; height: 100%; margin: 0; padding: 0; } .content {

2020-11-17 16:48:03 39

原创 解决div块中的img图片下方多出约3px高度的问题

html: <div style="border: 3px solid black;"> <img src="./test.png"> </div>效果如下图:原因:img图片的默认对齐方式为vertical-align: baseline;验证如下,给img加上vertical-align: baseline,效果不变:解决办法:1. display:block2. 改变vertical-align.

2020-11-11 21:04:52 9

原创 Vue项目控制首页不显示导航栏和左侧菜单

项目需求:所有的页面都有顶部导航条和左侧菜单栏,首页除外方法一:App.vue写上公用的导航条和菜单栏,所有的页面(包括首页)都注册到App.vue中,在routerview中显示,这会导致首页也会有左侧的菜单栏和导航条,通过使用vue-router中的元信息metarouter: { path:'/pages/home', component:home, meta:{ showMenu:true } },App.

2020-11-09 14:18:42 139

原创 解决element ui中form表单组件对齐以及label文字过长换行的问题

问题如下图所示:第二行与第一行上下宽度不一致,且label长度过长导致换行解决办法:增加label-width属性label-width 表单域标签的宽度,例如 '50px'。作为 Form 直接子元素的 form-item 会继承该值。 也就是form和form-item都支持这个属性,可以整体改也可以单独改这里采取整体修改的方式,代码如下:<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-.

2020-11-03 14:01:30 1300

原创 解决Property ‘validate‘ does not exist on type Vue 的问题方法总结

同时适用于各种"Property xxx does not exist on type 'Vue'"的问题,在此仅以表单验证的场景为例解决方法1:先定义,再引用let form: any = this.$refs.formform.validate((valid: Boolean) => {})解决方法2:(xxxas any).xxx语法this.type = 'test'(this.$refs['form'] as any).validate((valid : b...

2020-11-03 10:06:31 813

原创 修改element-ui 按钮 el-button的样式

以"type=primary"为例 以下为less语法.el-button--primary { background-color:#3461D2 !important; border-color:#3461D2 ; &:hover { background-color: #5291DB !important; border-color:#5291DB } &:active { background-color: #3461D2 !impo.

2020-10-28 10:25:30 918

原创 解决flex布局position:fixed定位失效的问题

场景:在封装tabbar组件的时候,代码和效果如下图:#tab-bar { display: flex; background-color: #ccc;}现在我想把导航栏固定到页面下方,自然想到fixed定位,于是兴高采烈(bushi)加了如下代码: position: fixed; bottom: 0;然后就变成了如下图所示效果:了解到原来是flex布局和绝对定位、固定定位(fixed、absolute)会产生冲突解决办法一:width:100%;.

2020-10-22 10:52:56 379

原创 deactivated和beforeRouteLeave中​​​​this.$route.path的区别

场景:四个一级路由,当从about跳转到profile的时候,控制台打印this.$route.path,观察二者的区别1. beforeRouteLeavebeforeRouteLeave (to, from, next) { console.log(this.$route.path) next() }当从about跳转到profile的时候打印this.$route.path如下可以看出:此时this.$route.path中保存的是跳转前的路径...

2020-10-21 17:30:13 16

原创 解决vscode中TypeScript报错“函数实现重复”的问题

命令行终端:tsc --init即可解决

2020-10-19 16:03:02 215

原创 Vue 和 Vue CLI指定版本的安装卸载以及查看版本号

0. 查看node、npm和webpack的版本node -vnpm -vwebpack -v1. 安装Vue CLI3和4版本(2基本很少用了)npm install -g @vue/cli//不指定版本会安装最新的 目前是4.5.7 (2020/10/15)npm install -g @vue/cli@3 //会安装最新的3的版本3.12.1npm install -g @vue/cli@3.6.3 //安装指定的3.6.3版本2. 查看Vue CLI版.

2020-10-15 18:07:14 276

原创 JS 对象数组去重的常用方法

0. new Set 的不适用项目中需要将一个对象数组去重,一般的数组去重可以直接用 new Set() 方法即可,但是对象数组的话,因为每一个元素都是引用类型比较复杂,使用new Set 无法进行去重,代码如下所示:var arr1 = ["张三","李四","王五","张三"]var arr2 = [{"id":1,"name":"张三"},{"id":2,"name":"李四"},{"id":1,"name":"王五"},{"id":1,"name":"张三"}];console.log

2020-10-15 15:16:25 53

原创 Vue自定义指令和v-show无法隐藏element-ui table组件 el-table-column的原因

1. v-showv-show起作用的本质是利用display:none控制隐藏element-ui table组件el-table-column的td是利用了display: table-cell 控制显示,如下图所示而display:table-cell的优先级又高于display:none,所以v-show失效了2. Vue自定义指令在执行自定义指令时该el-table-column所代表的dom节点还未完全生成,在结构中仅仅只有一个根div,也就是说自定义指令在dom尚未完.

2020-10-13 18:16:55 558

原创 Vue中子组件向父组件$emit传递一个和多个参数方法总结

1. 一个参数子组件向父组件传递一个参数时主要有以下两种方法//子组件this.$emit('itemClick',item)方法一:不加括号//父组件 <div id="app"> <Child @itemClick="handleItemClick"/> </div>methods:{ handleItemClick(item){ console.log(item) } }可以看到,如果父组件的事件

2020-10-10 22:10:50 588

原创 Vue中v-model和v-bind:value的区别以及手动实现v-model

以下都以input为例:一、Vue中v-model和v-bind:value的区别1. v-model//html<div> <input type="text" v-model="message" /> <div>{{message}}</div></div>//jsexport default { data(){ return{ message:'123' } }

2020-10-09 17:04:10 227

原创 解决vue通过索引值修改数组中的元素页面不改变的问题

根本原因:不能通过索引值 !因为Vue的内部没有监听通过索引值来改变数组,虽然data被更改,但是View层不会发生变化解决办法1:如果是插入或者删除可以通过数组的splice方法this.letters[0]='b'//替换成this.letters.splice(0,1,'b')解决办法2:插入或者删除也可以使用Vue的set方法this.letters[0]='b'//替换成Vue.set(this.letters,0,'b')Vue.set (要修改的数组

2020-10-09 10:42:29 313

原创 element ui中多选组件el-select选择后自动关闭

//html <el-select @change="selectChange" ref="selectAppType" style="width:620px" filterable remote clearable :remote-method="xxx" v-model="xxx" multiple <el-option v-for="item in xxx" :key=...

2020-09-27 09:38:50 349

原创 element ui 中el-button按钮,根据不同数据改变按钮type即显示颜色

//html<el-button :type="buttonType(val)">按钮1</el-button><el-button :type="buttonType(val)">按钮2</el-button>//js methods:{ buttonType(val){ if(val=="success"){ return "primary" } if(val=="failure")...

2020-09-25 15:31:09 1194

原创 Vue事件处理函数中同时传递event对象和其它参数

1. methods 事件调用的方法中不需要传递参数以下两种事件处理函数加括号和不加括号是等价的:// html<button @click='handleClick'>按钮1</button><button @click='handleClick()'>按钮2</button>//js methods:{ handleClick(){ console.log('点击了'); } }//输出两次"点击了

2020-09-24 10:54:37 570

原创 解决 vue data中数据之间的调用undefined问题

在data中直接用this肯定是错的,这就涉及this的指向问题不懂的可以参考我的另一篇文章为什么js对象的属性不能用this调用另一属性?所以选择在mounted生命周期中完成赋值操作export default { data(){ return { firstName:'111', lastName:'222', fullName:'' } }, mounted(){ this.fullName

2020-09-21 16:38:40 679

原创 点击列表中的哪一项,该项文字变为红色,默认第一项初始化为红色。

如果不让第一项默认显示红色,初始化给currentIndex赋值为-1或者其它值即可,但不能是空字符串。空字符串第一项仍然为红色。<template><div> <ul> <li v-for="(item,index) in movies" :key="item" @click='handleClick(index)' :class="{showRed:currentIndex == index}" >{{item}}<.

2020-09-21 10:59:10 53

原创 解决element-ui el-input输入框赋值后不能编辑以及延迟响应的问题

先看一下你的input是不是绑定的是对象中的一个属性如下所示: <el-input v-model="ruleForm.concernMember" placeholder="请输入关注人erp"></el-input>ruleForm: { concernMember: "" },这个问题一般有两种解决方案方案一:在data中给input的值赋一个初始值方案二:在给input赋值时,使用this.$set如上图代码.

2020-09-18 10:16:56 631 1

2018年美国大学生数学建模竞赛O奖论文(全部)

2018年建模美赛O奖论文集(全部)ABCDEF题O奖论文合集 往年的在其他的帖子

2018-11-06

2012年建模美赛O奖论文集(全部)O奖论文合集

2011年建模美赛O奖论文集(全部)O奖论文合集,其他的在我的别的帖子

2018-11-06

2011年建模美赛O奖论文集(全部)O奖论文合集

2011年建模美赛O奖论文集(全部)O奖论文合集 往年的在其他的帖子

2018-11-06

2010年建模美赛O奖论文集(全部)O奖论文合集

2010年建模美赛O奖论文集(全部)O奖论文合集 往年的在其他的帖子

2018-11-06

2009年建模美赛O奖论文集(全部)O奖论文合集

2009年建模美赛O奖论文集(全部)O奖论文合集 往年的在其他的帖子

2018-11-06

2008年建模美赛O奖论文集(全部)O奖论文合集

2008年建模美赛O奖论文集(全部)O奖论文合集 往年的在其他的帖子

2018-11-06

2007年建模美赛O奖论文集(全部)O奖论文合集

2007年建模美赛O奖论文集(全部)O奖论文合集 往年的在其他的帖子

2018-11-06

2006年美国大学生数学建模竞赛O奖论文(全部)

2006年美国大学生数学建模竞赛O奖论文(全部)其他年份的在别的帖子

2018-11-06

2013年建模美赛O奖论文集(全部)

2013年建模美赛O奖论文集(全部)ABCDEF题O奖论文合集 往年的在其他的帖子

2018-11-06

2014年建模美赛O奖论文集(全部)

2014年建模美赛O奖论文集(全部)ABCDEF题O奖论文合集 往年的在其他的帖子

2018-11-06

2016美国大学生数学建模竞赛O奖论文(全部)

2016年建模美赛O奖论文集(全部)ABCDEF题O奖论文合集 往年的在其他的帖子

2018-11-06

2015年美国大学生数学建模竞赛O奖论文(全部)

2015年美国大学生数学建模竞赛O奖论文(全部) ABCDEF题O奖论文合集

2018-11-06

2017年美国大学生数学建模竞赛O奖论文(全部)

2017年美国大学生数学建模竞赛O奖论文(全部)

2018-01-22

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人 TA的粉丝

提示
确定要删除当前文章?
取消 删除