- 博客(107)
- 资源 (2)
- 收藏
- 关注
RSS订阅转载 VUE img动态添加图片出不来的问题
参考：https://blog.csdn.net/weixin_45610868/article/details/105437597
2020-04-17 10:57:40
790
原创 element-ui给表格某列加样式
<el-table :cell-style="changeCellStyle"></el-table> changeCellStyle({ row, columnIndex }) { if (row.status === '未提交' && columnIndex === 8) { return { ...
2020-04-09 11:17:42
1691
原创 常见的正则规则
身份证正则/^([1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx])|([1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}(\d|X))$/正则用法参考https://do...
2020-03-27 18:08:07
395
原创 从身份证获取出生年月日
html部分 <el-col :span="12"> <el-form-item :label="$t('id_card')" prop="credentialNo"> <el-input v-model="form.credentialNo" @blur="getBirthday"></e...
2020-03-27 17:04:36
673
原创 input输入限制只能输入大写字母/数字/汉字等
1. 限制只能输入大写字母<el-input v-model="input" oninput="value=value.replace(/[^A-Z]/g,'');"></el-input>2. 限制只能输入数字<el-input v-model="input" oninput="this.value = this.value.replace(/[^...
2020-03-27 15:46:22
3478
转载 element-ui 的 messageBox按钮位置对换
参考https://blog.csdn.net/Dg_Zing/article/details/87898715
2020-03-10 17:45:37
2706
转载 js数组对象排序
compare(property) { // eslint-disable-next-line func-names return function (a, b) { const value1 = a[property] const value2 = b[property] return value1 - va...
2020-03-07 15:41:21
155
原创 element-ui表格回显时默认全选数据
html部分 <el-table :data="form.roomers" style="width: 100%" border tooltip-effect="dark" ref="multipleT...
2020-02-26 10:11:00
1409
原创 element-ui如何动态添加垂直表头跟数据
<el-table :data="tableData" style="width: 100%" border :row-class-name="tableRowClassName" @selection-change="handleSelectionChange"> <el-table-column :label...
2020-02-26 10:04:51
842
原创 对象数组筛选指定元素/删除指定元素
直接上例子：constarr1=[{id:1,name:'A'},{id:2,name:'B'},{id:3,name:'C'}]constarr2=[1,2]constarr3=arr1.filter(item=>arr2.includes(item.id)) // arr3为[{...
2020-02-13 09:57:43
1987
原创 element-ui表单验证加规则几种方法
要加验证之前一定要确保已经写了 prop属性，该属性是跟rule绑定在一起的。1.行内式 <el-form-item :label="$t('phone1')" prop="phone" :rules="[{ required: false, pattern: /^((\+\d{2}-)?0\d{2,3}-\d{7,8})|((\+\d{2}-)?(\d{2,...
2020-02-11 19:49:48
688
原创 element-ui树形控件 取部分值时父id也要一起拿到传给后端
基础用法 <el-tree :data="resourceData" ref="tree" node-key="id" :props="{ label: 'name', ...
2020-01-10 15:03:09
558
原创 vue 之展开收缩组件
展开收缩组件<template> <div> <div class="exp-col"> <img v-if="shzk" src="../assets/images/expand.png" alt="" @click="tack"> <img v-else src="../assets/images...
2019-12-02 09:09:10
1542
原创 element-ui之多选框的使用
多选框<el-checkbox-group v-model="items"> <el-checkbox v-for="(item, index) in allItems" :key="index" :label="item.id">{{item.label}}</el-checkbox></el-checkbox-group>&l...
2019-11-06 10:18:11
1367
原创 element-ui之穿梭框的使用以及空行问题
基础使用<template> <el-transfer :data="data" v-model="value"></el-transfer></template><script>data () { // data需要包含key跟label。是左边穿梭框所有的数据，value是右边的数据。 data: [...
2019-11-06 09:59:29
2107
1
原创 element-ui上传一张图片后隐藏上传按钮功能
html部分 <el-form-item label="封面大图"> <el-upload ref="avatar-uploader" class="upload-demo" action="http://localhost:3001/upload/" :httpRequest="uploadHttpDefault" :on-su...
2019-09-11 14:58:59
1471
原创 微信小程序学习之参考网址（mpvue版）
1. 初始化一个 mpvue 项目http://mpvue.com/mpvue/quickstart/2. mpvue 使用详细教程https://www.jianshu.com/p/6f8d74be3ff83.微信小程序标签https://blog.csdn.net/weixin_42603150/article/details/809083084. ui之 iviewht...
2019-09-10 10:40:08
220
原创 路由传参 / 保存路由跳转带过来的查询字符串并操作
在新闻跳转到新闻详情传递 id// 新闻页面传递 id detail(row) { this.$router.push({ path: '/home/detail', // 要注意与 routes 中的路径一致 query: {id: row.id} }) } // 详情页面获取 id methods中： ...
2019-09-09 10:02:36
395
原创 vue 动态添加class，三个以上的条件做判断
如果 status为1，样式为redRoom如果 status为2，样式为greenRoom1如果 status为其他，样式为greenRoom2:class="{'redRoom': Number(items.status) === 1, 'greenRoom1': Number(items.status) === 2, greenRoom2: Number(items.st...
2019-09-09 09:53:27
8726
原创 element-ui 上传多张图片并显示图片列表 / 修改时显示图片列表
template部分： <el-row class="searchForm"> <el-col :xs="24" :sm="24" :md="24" :lg="24"> <el-form-item label="正文图片"> <el-upload action...
2019-09-06 16:25:55
5490
原创 element-ui 的table中让某个单元格变色
<el-table :cell-style="yellowBg"></el-table>methods中： // 未指派时，背景变黄rowIndex是第几行，columnIndex是第几列 yellowBg ({row, column, rowIndex, columnIndex}) { if (row.statusName === '...
2019-09-02 16:33:08
5400
原创 写代码来生成对应格式的文本，虽然第一次很花时间，但是代码写完后，就可以不断的重用了。
var str = `// 内容内容`;var arr = str.split('\n');arr = arr.filter((s)=>{return !(s.trim() == '');})arr = arr.map((s)=>{return "'" + s.trim() + "'";})console.log("[", arr....
2019-09-02 09:31:31
184
原创 css 文字太多用省略号表示
p { width: 200px; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; /* 可以显示的行数，超出部分用...表示*/ ...
2019-08-28 11:35:56
228
原创 前端渲染跟后端渲染的区别
前端渲染：前后端分离，前端先写好页面后，拿到后端给的api接口，把数据添加到页面中渲染出来。如果没有后端，只是不能进行数据交互，用户还是能看到页面的。右键查看网页源代码，前端渲染的东西只能看到渲染后的，而无法看到原来的代码。后端渲染：数据跟页面都是一起渲染到浏览器上的。如果没有后端，那么整个页面都会出不来，因为数据跟页面是一起渲染到浏览器上的。而后端渲染的 ，右键查看网页...
2019-07-17 18:30:01
470
原创 vue+element-ui 表单的 el-input 第二次修改时无法输入
由于新增跟修改用的是同一个弹窗，所以当修改提交时，要清空 input 框内的值。提交时不能只把 父对象formData 设置为空对象。即this.formData = {} 是错误的正确的写法为this.formData = {name: '' }原因：如果把this.formData设置为空，this.formData.name 就是 undefined，此时就会赋值不上。 ...
2019-07-10 16:47:20
3822
1
原创 element-ui 轮播图/幻灯片/走马灯，点击轮播图之后出来一个放大的轮播图对话框
以下为自适应宽高的，注意行内样式中间使用分号隔开的，不是逗号，否则会不生效。外面的轮播图<el-carousel height="150px" arrow="always" indicator-position="none" @change="carouselChange"> <el-carousel-item v-for="(item, index) in e...
2019-07-05 18:28:29
7106
原创 vue过滤器 | 管道
过滤器，是一个有参数，有返回值的方法。其作用在于用户输入数据后，它能够进行处理，并返回一个数据结果。例： uppercase过滤器 : 将输入的字符串转换成大写字母的过滤器过滤器可以用在两个地方：双花括号插值和v-bind表达式。过滤器应该被添加在JavaScript表达式的尾部，由“管道” | 符号指示： 全局 ：范围大，如果出现同名时，权利小 组件内: 如果...
2019-07-03 17:02:49
681
原创 查询条件下拉框联动，如果一级为空，二级也为空
直接祭出代码template中 <el-col :xs="24" :sm="12" :md="8" :lg="6"> <el-form-item label="楼宇"> <el-select v-model="searchData.buildingId" clea...
2019-06-28 18:33:46
800
原创 下拉框如何获取到value跟code
遍历后端传来的 units 数组，[{value: ‘'区域一',code: '1'},{value: '区域二',code: '2'}]<el-form-item label="活动区域" prop="unit"> <el-select clearable v-model="unit" @change="getRoomByUnit"> &l...
2019-06-25 15:19:34
727
原创 传值给后端需为 int 类型，但一开始默认为空的搜索条件如何传0给后端
加一个判断，当一开始的搜索条件为空时，给相应的字段重新赋值为0。此处不可用this.searchData.building = 0的形式赋值。否则一开始刷新，页面会显示0。 /* 获取表格列表 */ searchInfo () { let searchDataFinal = {} if (this.searchData.building =...
2019-06-25 11:26:08
2555
转载 什么是 token 以及 token 怎么用
Token的引入：Token是在客户端频繁向服务端请求数据，服务端频繁的去数据库查询用户名和密码并进行对比，判断用户名和密码正确与否，并作出相应提示，在这样的背景下，Token便应运而生。token 的作用：在进行敏感操作之前，每个请求需要携带token,但是token 有有效期，token 失效后需要换取新的token并继续请求。参考：什么是 tokenhttps://w...
2019-06-24 15:11:24
2278
原创 查看后返回原路径 当前页 / 在当前页的某个位置 的方法
返回后当前页的方法由于这里一开始进来的pageIndex为空，所以默认为 MouseEvent 函数对象，所以我用了类型来判断searchButton: _.debounce(function (pageIndex) { let result = typeof pageIndex if (result === 'number') { this.searchD...
2019-06-24 11:04:14
266
原创 filter 对已知数组进行筛选，返回为true的元素或对象并组成一个新数组
定义和用法filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。返回数组，包含了符合条件的所有元素。如果没有符合条件的元素则返回空数组。注意：filter() 不会对空数组进行检测。注意：filter() 不会改变原始数组。 arr = [{a:1,b:2,isChecked:true},{a:0,b:1,isChecke...
2019-06-21 16:34:59
4568
转载 Javascript中0除以0得到NaN，1除以0得到infinity（无穷尽）
1、任何数值除以0都会导致错误而终止程序执行。但是在 JavaScript 中，会返回出特殊的值，因此不会影响程序的执行。2、比0大的数除以0，则会得到无穷大，所以 js 用 Infinity 来显示出来0 / 0; // NaN1 / +0; // Infinity 无穷1 / -0; // -Infinity 负无穷参考：https://blog.csdn.net/wei...
2019-06-11 14:24:03
2107
原创 查询字符串的定义及其作用
作用把参数给后端。当参数为随机数时，每次都重新请求，让页面不缓存，永远访问最新的数据 var url="index.jsp"+"?a="+Math.random();什么是查询字符串？参数就是程序中可变的部分，比如说www.abc.com/profile.jsp?userid=zhangsan你有个叫profile的页面，那么可以根据userid的不同，显示不同用户的信息www...
2019-06-11 11:19:23
1791
原创 文字颜色渐变
文字从左到右三种颜色渐变h1,h2 { background: linear-gradient(to right, #7FB746, #009EE2, #0054A7); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}效果图参考：https://blog.csdn.net/q...
2019-06-06 11:22:41
364
原创 vue中keep-alive的用法及问题描述
使用场景：在做电商有关的项目中，当我们第一次进入列表页需要请求一下数据，当我从列表页进入详情页，详情页不缓存也需要请求下数据，然后返回列表页，这时候我们使用keep-alive来缓存组件，防止二次渲染，这样会大大的节省性能。在业务开发中，会有路由跳转但是返回需要保留数据的场景，vue 中提供了 keep-alive 来处理<keep-alive> <router-...
2019-06-05 16:29:19
605
原创 文字/盒子大小响应式
根据媒体查询解决html { font-size: 10px;}@media only screen and (min-width: 100px) and (max-width: 1366px) { h1 { // 这里的em是根据根节点html元素的font-size倍数来计算的 font-size: 2.5em; // 所以最终的是25px } div{...
2019-06-04 15:43:10
281
原创 element-ui表单加判断条件显示必填或非必填 :required
需求： 如果下拉框中选中的国家为中国，省份为必填；如果选中的为外国， 省份为非必填。<el-col :xs="24" :sm="12" :md="12" :lg="6"> <el-form-item :label="国家" prop="country"> <el-select clearable v-model="from.country...
2019-05-30 18:05:57
23010
3
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人