前端开发问题记录
关注
分享
扫一扫
本篇专栏主要是为了记录下前端开发所遇到的问题，和一些解决方案，便于下次查询
管火火火
这个作者很懒，什么都没留下…
展开
-
uni-scroll-view隐藏滚动条
uniapp中 ，uni-scroll-view隐藏滚动条的方法 /deep/.uni-scroll-view { background-color: #fff; } /deep/.uni-scroll-view::-webkit-scrollbar { /* 隐藏滚动条，但依旧具备可以滚动的功能 */ display: none }其他的方法同样适用效果图...原创 2019-07-10 20:44:13 · 8317 阅读 · 0 评论 -
前端移动App flex布局方法
阅读目录flex布局介绍：flex布局实例：flex布局的其它css属性：兼容： 参考：回到顶部flex布局介绍： flex布局很灵活， 这种布局我们也可以称之为弹性布局， 弹性布局的主要优势就是元素的宽或者高会自动补全;回到顶部flex布局实例： 比如有两个div，一个div的宽度为100px， 想让另外一个div的占据剩下的宽度：运行下面代码&l...原创 2019-06-05 16:43:08 · 700 阅读 · 0 评论 -
flex让盒子超出两个换行
html写法：注意我这里用的是uni-app的语法，view就是div 其他相同 <view class="abitem"> <view class="itemleft" v-for="(item,index) in iconType" :key="index"> <img :src="item.img" size="26" /> &l...原创 2019-07-09 09:10:45 · 6617 阅读 · 0 评论 -
vue_elementui_el-upload禁止el-upload弹出本地选择文件窗口，控制el-upload弹出本地弹窗
想要禁止el-upload弹出本地选择文件窗口，只需要用到一个方法就行了 :disabled=“authenStatus==0?true:false”template代码 <el-upload :disabled="authenStatus==0?true:false" //此处直接写上判断条件，即可禁止本地上传文件的弹窗是否弹出 ...原创 2019-07-25 18:16:42 · 20702 阅读 · 8 评论 -
vue_elementui_tab刷新保持当前状态
template中的代码 <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect" > ...原创 2019-07-25 18:10:53 · 2575 阅读 · 0 评论 -
vue_elementui拖住滑块拼图验证代码
vue拖住滑块拼图验证，以下是cavas直接写的滑块拼图验证码，直接复制即可使用转载请注明本宝宝，谢谢<template> <div id="puzzle" ref="puzzle" style="display:inline-block;"> <!-- :style="'padding:' + 16*scale + 'px ' + 16*scale +...原创 2019-07-12 18:13:25 · 4231 阅读 · 0 评论 -
el-radio-group for循环方法
经常会遇到el-radio-group 和 el-radio是一个列表，需要遍历出来，然后将选中的值赋值过去，页面中很多地方都用到这个组件，如果用到的地方很多，可以el-radio-group提取出来，直接传Array数组即可。template模板中的写法如下<el-radio-group v-model="form.informantType"> <...原创 2019-07-06 18:01:13 · 13050 阅读 · 0 评论 -
elementui提取table表格封装组件，elementui提取table表格单列展示按钮的展示效果
后台管理系统中用到了非常多的表格，一般为了方便都会讲表格进行提取，形成公共组件。提取表格时会遇到返回的json数据中要对单个字段进行处理，如时间戳转换，状态转换等封装的表格组件代码<template> <div> <!-- 中部列表表格 --> <el-table :data="tableData" hig...原创 2019-07-05 19:03:23 · 1960 阅读 · 1 评论 -
vue_elementui_formatter的使用方法_elementui提取table表格使用formatter方法
后台管理系统中用到了非常多的表格，一般为了方便都会讲表格进行提取，形成公共组件。提取表格时会遇到返回的json数据中要对单个字段进行处理，如时间戳转换，状态转换等封装的表格组件代码<template> <div> <!-- 中部列表表格 --> <el-table :data="tableData" hig...原创 2019-07-05 18:59:18 · 23211 阅读 · 4 评论 -
vue select传多个值，传多个值的方法
el-select遍历方法，在el-select中写上@change，如@change=“pickRoleName” <el-select @change="pickRoleName" v-model="ToviewForm.deptId" placeholder="请选择" ...原创 2019-07-05 18:45:50 · 7105 阅读 · 0 评论 -
vue ElementUI后台管理系统开发完整开源代码+左侧菜单tags标签缓存
左侧菜单点击在右侧tags显示标签并缓存菜单树状层级展示原创 2019-06-28 15:23:24 · 3089 阅读 · 4 评论 -
vue后台管理系统开发完整开源代码基于elementUI
顶部菜单+左侧菜单+tags标签缓存左右滑动+菜单层级原创 2019-06-28 15:17:12 · 12218 阅读 · 2 评论 -
vue报key值重复时解决办法Duplicate keys detected: ''.This may cause an update error.
vue报key值重复Duplicate keys detected: ‘’.This may cause an update error.为什么for循环后要加key值，否则会爆红，会产生什么影响？for循环读取key值时， key需要是唯一的，如果key值重复会导致报错，影响页面渲染卡顿。出问题的代码 <el-col :span="1" v-for="(one,i...原创 2019-06-14 15:48:30 · 44038 阅读 · 3 评论 -
vue中history和hash的区别和使用方法
hash模式，带#号，不美观最好的坏处就是，例如比如生成二维码的时候会自动过滤掉#后面的参数，微信登录，已经分享的时候都会把#后面的参数或者路径都过滤掉，这样我们就很不方便了，导致一些Bug的产生，所以要用到history模式。history利用浏览器的history.pushState API来跳转无需加载页面，当使用history模式时，URL就是正常的URL，如http://www.we...原创 2019-06-10 16:14:07 · 3419 阅读 · 0 评论 -
解决vue+axios请求报错POST http: net::ERR_CONNECTION_REFUSED,在封装的请求中统一处理请求异常的问题
0.先写如何封装 axios请求 import axios from 'axios' import qs from 'qs' import { Message } from 'element-ui' //post请求 export const post = (url, data = {}) =&amp;amp;gt; { r...原创 2019-03-18 14:13:19 · 40630 阅读 · 0 评论 -
vue移动appUI框架搭建-选取mintUI
搭建了一下mintUI，使用时vue2.0 ，mintUI本身挺好用的，但是很久没人维护了，所有仅仅搭建了UI。后来又用vue3.0，选取vantUI搭建了一套移动app框架。我会详细写一下vue3.0，选取vantUI搭建的系统。敬请期待~项目开始预备vue-cli脚手架工具 npm install vue-cli -g 下载全局脚手架 vue init webp...原创 2019-03-18 12:31:03 · 812 阅读 · 0 评论 -
先加载完数据，再加载页面
答：先false隐藏，再一步回调中显示原创 2019-03-05 11:14:21 · 3690 阅读 · 1 评论 -
截取当前数据到小数点后两位，三位等
dateLong2String(value) { // 截取当前数据到小数点后三位 let transformVal = Number(value).toFixed(3); let realVal = transformVal.substring(0, transformVal.length - 1); // num.toFixed(3)获取的是字符串 ...原创 2019-03-05 11:13:57 · 2014 阅读 · 0 评论 -
时间格式的转换，时间戳转日期-年月日时分秒
//时间转换dateLong2String(time) { var date = new Date(time); var year = date.getFullYear(); var month = date.getMonth() + 1; var day = date.getDate(); let h = date.getHours(); h = h < 10 ?...原创 2019-03-05 11:13:38 · 1479 阅读 · 0 评论 -
一篇业务需求上的数据处理问题--后台API只返回四个字段ABCD，现在数据量较大有20万条，一列上要展示ABCDABCDABCD这么些字段
业务需求详解： 业务需求数据处理-后台API只返回四个字段ABCD，现在数据量较大有20万条，一列上要展示ABCDABCDABCD这么些字段，这时服务端他不会给你做处理，只能前端自己处理了，将对象forEach遍历添加到一个新的obj中，当index%30，当index%31时，当index%3==2时分别push存储到obj对象中使用框架为vue .then(res => { ...原创 2019-03-05 11:13:03 · 478 阅读 · 0 评论 -
vue列表鼠标滚动翻页（数据量较大，几千万条数据，因此要滚动翻页，为了性能良好，鼠标滚动时发送请求页码page++），网上找不到自己写了一个，
标题 ：vue列表鼠标滚动翻页（数据量较大，几千万条数据，因此要滚动翻页，为了性能良好，鼠标滚动时发送请求页码page++），网上找不到自己写了一个，如果用window. 或document.body会导致滚动穿透，导致如果多个页面要用到滚动翻页时，会发送其他页面的ajax或axios1.先在要滚动的div上自定义名称 ref=“scrolltoplist”<div ref="scrol...原创 2019-03-05 11:11:15 · 1280 阅读 · 0 评论 -
vue修改自带的title属性样式，title属性样式修改办法
1.定义id=‘title’ :data-title=“itemss.contactsCallTime2” 这个值<div class="grid-content1 bg-purple-light" id="title" onmouseover="onMouseHover(event)" onmouseout="onMouseOut()" :data-...原创 2019-03-05 11:07:59 · 25865 阅读 · 1 评论 -
app移动端 rem和px的换算
rem.js文件/** * Created by zhaolele on 2018/7/25. */(function(doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', recal...原创 2019-03-05 11:06:34 · 1730 阅读 · 0 评论 -
vue搜索关键字字体高亮, map映射新数组，replace替换，font字体样式
.then(res => { res.detail.list.map((item,i)=>{ item.smsMsg=this.brightenKeyword(item.smsMsg,this.pagination.content) }) //调用brightenKeyword方法 this.tabl...原创 2019-03-05 11:04:28 · 1231 阅读 · 0 评论 -
vue文字截取方法 ：title | filterFun方法过滤
{{aa | filterFun}}// filters:过滤 filters: { filterFun: function(value) { if (value && value.length > 8) { //字符最大长度 value = value.substring(0, 8) + "..."...原创 2019-03-05 11:03:00 · 2258 阅读 · 0 评论 -
vue+js排序方法JavaScript localeCompare() 方法
res.devices_list={device_last_use_date:'111110000' //13位时间戳或者时间格式的时间}res.devices_list.sort((a, b) => b.device_last_use_date.localeCompare(a.device_last_use_date)); //升序或降序注释说明：比较结果的数字。如果 b.de...原创 2019-03-05 11:00:31 · 1953 阅读 · 0 评论 -
vue后台管理系统搭建
软件架构软件架构说明：本项目使用vue框架，写的一个后台管理系统使用说明**项目开始之前,**先安装npm 将taobao作为镜像文件,切换到到cnpm,步骤如下:前提 node.js中已经包含了npm，需要检测npm安装好了没有0. npm -v0.1 npm install npm -g 升级npmnpm i nrm -gnrm lsnrm use taobao||cnp...原创 2019-02-22 09:47:13 · 2112 阅读 · 0 评论 -
前端小小开张
大大小小写了好几个项目，有web后台管理系统，H5 移动app页面，简单的小程序。第一年主要用bootstrap,jquery，ajax来写业务.第二第三年主要用VUE，es5，6，UI框架采用elementUI，mintUI,MUI,iview来写业务。说的比较简要，慢慢更新中，开始更新工作中开发主要的过程，如项目搭建，公共组件的提取，业务中遇到数据的处理方法。。巴拉巴拉等等。。路漫漫其...原创 2019-02-21 16:47:11 · 135 阅读 · 0 评论