前端
0.0
Point酱
立志写优雅的代码
展开
-
【vue】数据加载后渲染页面
vue 想要先加载完所有数据再渲染页面使用v-if来控制先设置showCard为false,内容card为"" 请求成功后设置showCard为true,内容card为请求得到的数据res.data<div v-if="showCard"><div>data() { return { card:"", showCard:false, }} created() { this.$vux.loading.show({ text: "正在加转载 2021-09-08 11:20:18 · 9754 阅读 · 0 评论 -
【vue】退出登录清除token
咱们言简意赅行吗 logout() { var storage = window.localStorage; storage.clear(); this.$router.push(`/login?redirect=${this.$route.fullPath}`); //跳回登录地址}原创 2021-10-22 09:39:21 · 4331 阅读 · 1 评论 -
【LuckyExcel】解决点击单元格失焦效果
理想实现效果:Bug描述:为了让数据展示和编辑更清晰和方便,决定在管理系统引入LuckyExcel,想用el-drawer展示出来,过程还算顺利,但是发现鼠标点击单元格的时候,无法呈现突出效果,很不利于体验。Bug原因:el-drawer的层级太高,luckysheet-cell-selected的z-index只有15,并且el-drawer每次打开,它的z-index会自增1……解决办法 :本来想直接改luckysheet-cell-selected ,但是就是改不成功于原创 2021-10-14 13:03:03 · 1165 阅读 · 0 评论 -
【vue】更改vue-element-admin的主题色
2、src/styles/variables.scss去element官网的(Color 色彩)中https://element.eleme.cn/#/zh-CN/component/color去找自己想要的颜色,替换即可。// sidebar$menuText:#bfcbd9;//普通按钮字体颜色$menuActiveText:#409EFF;//选择模块的字体颜色#F56C6C$subMenuActiveText:#f4f4f5; //选中模块父级按钮字体颜色#E6A23C$men原创 2021-08-18 14:47:02 · 1950 阅读 · 0 评论 -
【vue】el-tree获取选中的父子数据,拼json
目录前言需求万恶之源 拼json关于el-tree走的弯路解决办法第一步第二步(问题解决的关键)第三步前言真就是前端小白了,这个el-tree折磨了我一晚!这个我必须要好好记录下!!!请看清我的需求,如果你的需求和我的差不多,那么理解本文就够了。需求万恶之源 拼json后端传给我一个树的数据结构,我需要用el-tree来显示,并对其操作,然后再返回数据给到后端用来存储。(后端返回给我的数据样式) ????我用el-tree将其显示出来的是全原创 2021-10-28 10:51:57 · 3680 阅读 · 2 评论 -
【vue】Element UI实现表格表头纵向显示
element实现表格表头纵向显示我们正常使用Element UI写表格的时候,<el-table-column/> 标签里面都是纵向的。那么我们的需求有时候会要求行列转换,那么来看看咋整吧....(想起了当年的python作业...虽说整出来后觉得简单,但做的时候还是浪费了很多时间,好在开源yyds,找到了解决办法。)下面参考来自:http://www.manongjc.com/detail/18-mjmvpumszjdxfut.html????展示效果<templat原创 2021-08-03 09:24:40 · 24041 阅读 · 8 评论 -
【vue】el-input 实现换行批量搜索
关于如果用el-input框实现换行 批量搜索功能。原创 2022-03-02 10:26:03 · 922 阅读 · 0 评论 -
【vue】v-for按照字段自定义排序
需求:v-for一个数组,按照数组里面的orderNumber排序。解决:关键代码如下???? <li v-for='item in sort'> {{item}} </li> computed:{ sort:function(){ return sortByKey(this.modules,'orderNumber'); //this.modules是原数组 }原创 2021-09-27 16:06:06 · 2043 阅读 · 0 评论 -
【vue】post上传get下载文件 之el-upload
目录一、实现展示二、接口三、实现过程一、实现展示二、接口1、post 上传接口2、get下载接口3、删除接口4、文件列表接口三、实现过程1、用el-upload进行附件上传/ 将文件列表接口里的数据,渲染成table,方便我们找到它的id进行操作。对文件列表进行判断,如果没有值,就文字提示:【暂未上传】<el-card style="margin-top:20px"> <div slot="header" class="原创 2021-11-09 15:50:33 · 2111 阅读 · 0 评论 -
【vue】手把手创建vue项目并上传github(mac版)
本文目的一、创建一个能跑起来的空的vue项目二、将该项目上传至github为后续代码进行管理一、创建一个能跑起来的空的vue项目1、前提:macbook2、需要已经安装好nodeJSwebpackcnpm install webpack -gvue-clisudo npm install -g vue-cli(如下图)淘宝镜像(可选) npm install -g cnpm --registry=https://registry.npm.taobao.org原创 2021-07-13 12:13:34 · 668 阅读 · 1 评论 -
【vue】根据条件更改表格某一行的背景颜色-实现高亮
实现很简单,参考下面的代码在table头里面加入 :row-style="tableRowStyle" //加上这句在methods里面加入方法,注意设置对象并返回。tableRowStyle({ row, rowIndex }) { let rowBackground = {}; if (row.ispay==true) ) { // 设置条件 rowBackground.background = "#E6F7FF"..原创 2021-08-19 14:34:17 · 3990 阅读 · 7 评论 -
【vue】一些有用的基础知识
常温常新,更新中原创 2022-01-24 10:54:09 · 467 阅读 · 0 评论 -
【vue】post请求接口时,以数组的形式传参处理方法
需求:做搜索时候的需求,需要给后端传数组控件: <el-select v-model="search.projectUuidList" placeholder="请选择项目名称" filterable clearable @change="searchHandler" > <el-option v-for="item in projects" :key="item.proje.原创 2021-10-22 13:10:17 · 3263 阅读 · 0 评论 -
【vue】路由vue-router
进阶小白对路由的理解原创 2021-07-16 10:57:59 · 164 阅读 · 0 评论 -
【已解决】关于 luckysheet 设置纯文本,解决日期格式回显错误的办法
在excel里面输入内容,如 2023-2-17 12:00 保存后,传回后端的数据被转化成了 数值类型,这显然是一种困扰。原创 2023-02-17 13:28:54 · 2326 阅读 · 4 评论 -
【vue】优雅的首页-早晚安问候语实现
模板中调用{{getTimeState()}}代码 getTimeState(){ // 获取当前时间 let timeNow = new Date(); // 获取当前小时 let hours = timeNow.getHours(); // 设置默认文字 let state= ``; // 判断当前时间段 if (hours >= 0 && hours <= 10) { stat原创 2021-08-18 14:43:45 · 1159 阅读 · 0 评论 -
【JS】一生之敌 拼数据
你永远不知道后端会返给你什么数据结构。原创 2021-11-05 17:21:37 · 132 阅读 · 0 评论 -
【JS】带格式的复制DIV内容的方法
一个方法适用ALL原创 2022-11-01 10:54:36 · 502 阅读 · 0 评论 -
【JS】跨域问题读写cookie的解决办法
跨域Cookie共享:访问A站点时已经登录从而保存姓名、头像等基本信息,这时访问该公司的B站点时就自然而然的能显示出这些基本信息,也就是实现信息共享(在银联体系中A银行办理的卡也能在B银行能取出钱来,也就是实现余额“共享”)原创 2022-11-15 17:18:00 · 4324 阅读 · 0 评论 -
【js】基础篇(持续更新)
记录下。。。持续更新1、反向显示indexv-for="(item, index) in this.showTreeData"{{ showTreeData.length - index }}原创 2021-10-29 17:01:55 · 114 阅读 · 0 评论 -
【CSS】关于使用v-html时,不想展示某元素的隐蔽办法
比如不想展示图片,可以利用img标签的display设置.question-table { .txt { img { display: none; } }}原创 2022-04-08 15:55:29 · 441 阅读 · 0 评论 -
【Vue】如何快速优雅展示一个自适应不错乱的静态页面
利用transform的属性,使得页面根据页面去自适应的缩放,那么不管用户屏幕什么分辨率,我们都可以让他看见一个不错乱和UI稿一致的页面。原创 2022-06-22 13:51:30 · 804 阅读 · 0 评论 -
【css】一个只用css即可实现的完美跑马灯方案
1、一段文字在页面上方滚动播放,即跑马灯。2、鼠标移动上去,字会停住。代码如下:可以自己尝试。原创 2023-03-29 10:35:42 · 305 阅读 · 0 评论 -
【css】关于pdf分页(page-break)
最近的在写报告的需求,因为报告内部需要加入echarts,并且用于真实的数据导出,还要动态掌控????。所以需要前端将给定的word模版转为网页。这里分享其中的一个小小技巧。那么问题来了,我们如何把控页面的样式,并可以轻松做到控制不同内容的分页呢。快点告别margin...吧!那么CSS来了!page-break-before顾名思义,此CSS属性用于在打印文档时在元素之前添加分页符。在打印文档期间,它将在指定元素之前插入一个分页符。我们不能在绝对定位的元素上使用此CSS属性,也不能在不会生原创 2021-10-27 09:36:03 · 2115 阅读 · 0 评论 -
【css】vue中台风格总结(持续更新)
就小总结下吧....方便后面节省时间原创 2021-07-23 15:21:39 · 651 阅读 · 0 评论 -
【vue】v-for给循环出来的div设置不同的背景色
第一步:给要循环的盒子动态绑定class名 并且传入一个数组 <div v-for="(i,a) in serve" class="sever_box2"> <div :class="sstt[a]"> 吧啦吧啦 </div> </div>第二步:在data中定义这个数组data() { return { sstt: [ "ss1"原创 2021-11-03 17:57:52 · 5825 阅读 · 0 评论 -
【CSS】关于超过的文字使用省略号的办法
<div v-html="item.quesDesc" class="txt"></div> .txt { padding-top: 10px; word-break: break-all; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidd...原创 2022-04-08 15:58:10 · 464 阅读 · 0 评论 -
【css】完美解决页脚自适应布局
页面内容内容超出的时候,页脚跟随页面滚动,变成正常的流体布局。当页面内容不足时,页脚始终在最底。原创 2023-02-03 15:12:24 · 411 阅读 · 0 评论 -
【css】img和span同行完美的解决办法
一个img 搭配一个span ,有一个神奇的办法可以实现它们始终在同一水平线的完美效果。原创 2023-02-03 15:06:31 · 1644 阅读 · 0 评论 -
【css】关于ul li使用出现导致的样式错误问题
这应该是一篇无营养的博文,但错的时候确实挺懵这里要注意,ul li的标签无样式的显示 如下图(看个样式就好啦)但是在实现的过程中,会发现一些错误问题,其实很白痴,但是细心一点才会找到错误点。一、无缩进这种情况一般是因为只写了li,没有套ul。 样式是由ul自身带的<ul><li></li></ul>二、出现如图情况这种就是标签写反了…要让ul在外面套li三、li之间存有缝隙解决办法如下:ul,li{margin:0px;}..原创 2021-06-17 17:10:51 · 675 阅读 · 0 评论 -
【已解决】vue报错 you may have an infinite update loop in a component render function
没错就是上面的bug我的需求是给数组排序,于是我找了个新的新组sortList接了一下,结果一看靠什么鬼错误 dealMyDate(v) { this.sortList = this.list.filter((item) => item.date == v); this.sortList.sort(function(a, b) { return b.time < a.time ? 1 : -1; }); ret...原创 2021-10-14 15:01:52 · 825 阅读 · 0 评论 -
【vue】点击获取循环列表的某一项内容
<template> <div> <ul> <li class="item" v-for="item in arrData" :key="item.id" @click="getData(item.id,item.title)"> {{ item.title }}id={{item.id}} </li> </ul>.原创 2021-09-24 14:14:55 · 1724 阅读 · 0 评论 -
Node学习篇
最近刚刚学习了下node,和node的express框架,所以前来小总结一下Node.js简单的说 Node.js 就是运行在服务端的 JavaScript。Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台。Node.js是一个事件驱动I/O服务端JavaScript环境,基于Google的V8引擎,V8引擎执行Javascript的速度非常快,性能非常好...原创 2019-11-22 17:12:07 · 252 阅读 · 0 评论 -
关于input标签知识点汇总
方法一:style=“padding-right:距离px;” 放在td或 div等里面方法二:style=“margin-right:距离px;” 放在 input 按钮里面方法三:是table做的话 多做个td 用俩个或者3个td 最后一个td给整个table的3/1宽度中间的td里放按钮方法四:按钮后面给空的代码 1一个代表1个空格方法五:给按钮加上right=“距离”可以设置成自...原创 2019-03-15 19:40:10 · 455 阅读 · 0 评论 -
JS获取输入的用户名
代码msg返回的就是用户的名字。这里我设置了个按钮可以查看。目的是为了测试~~<!doctype html><html><head><meta charset="utf-8"><title>login</title><!--css部分--><style原创 2018-12-21 11:22:56 · 4335 阅读 · 0 评论 -
正则表达式验证数字js
验证数字的正则表达式集验证数字:1$验证n位的数字:^\d{n}$验证至少n位数字:^\d{n,}$验证m-n位的数字:^\d{m,n}$验证零和非零开头的数字:^(0|[1-9][0-9])$验证有两位小数的正实数:2+(.[0-9]{2})?$验证有1-3位小数的正实数:3+(.[0-9]{1,3})?$验证非零的正整数:^+?[1-9][0-9]$验证非零的负整数:^-[1...转载 2018-12-12 09:07:26 · 197 阅读 · 0 评论 -
HTML-间歇循环滚动
实现滚动播放<!DOCTYPE html><html><head><meta charset="utf-8"/><title> 间歇循环滚动</title><style>#box{ height:240px; width:300px; marg原创 2018-12-09 16:15:47 · 1086 阅读 · 0 评论 -
HTML声明版权下框代码
.bottom { position:absolute; right:0px; bottom:0px; background:#000000; color:#fff; display:block; width:10...原创 2018-12-01 20:06:13 · 13857 阅读 · 0 评论 -
【WEB】关于网页设置 background-image: url死活显示不出来的解决办法
图片或者背景显示不出来,大部分都是路径的问题。这是我图片所在的文件夹。相信很多有这个问题的小伙伴都是像我下面这样写的路径。那么背景图是不会显示出来的。。解决办法如下图!原因是:在img的src中,是以当前html网页做相对文件,来设置引入图片的路径。在外部样式css文件中,设置某个元素的background-image的url();是以你当前的css文件所在路径做为相对路径找起。...原创 2019-03-24 15:14:58 · 20060 阅读 · 1 评论 -
关于css设置Comic Sans Ms字体
很喜欢这种手写风格。 font-family: "Comic Sans MS", "Comic Sans", cursive;原创 2019-05-19 15:12:55 · 2173 阅读 · 0 评论