聪明不喝牛奶的博客

如何让表格中的单独一行的某一列用其他的颜色标识出来

让div盒子（form表单）水平垂直居中显示CSS没怎么学好，就这个搞得我头皮发麻，不过还好的是把他啃下来了…废话不多说直接上代码<style>.login-form{ //让登录框水平居中 box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.5); //让登录框增加阴影 border-radius: 8px; //增加登录框的圆弧角 width: 400px; max-width: 100%; padding: 0

vue 实现多个空白占位符项目检查的时候，被老板一顿逼逼。揪着无关紧要的登录二字的空格逼了我很久。没办法老板就是老板。我一开始用的是在 登录中添加一个空格符 如：登&nbsp;&nbsp;录 自信满满的去查看效果，但是结果总是和我想的有点出入，发现并没有什么效果。几番查阅之后我才了解到原来在vue中是不会解析html的占位符的，所以刚刚那顿操作是没啥用的。那怎么办呢？首先export default { data(){ return{ title: '登\u3

对element-UI 的表格进行自定义的修改在项目的开发过程中，我们有时候需要类似于只有表头的下边框和底边框然后表头字体的加粗自定义的需求，element-UI 提供的表格并不能满足开发需求。那么我先上我自定义好的表格样式，如果你的需求跟我一样那就接着往下看吧！我需要的是对表格里面的边框去掉让他变成是空白然后把表头的的下边框加粗变黑，以及将 <el-input> 框的边框去掉让这个看上去就是一个检测的体检表。首先 <el-table :data="tabl

vue-admin-template 整合 echarts 实现折线图数据展示在项目开发过程中会碰到的就是将数据通过图表的形式展示出来，那么这个就不得不提一下百度唯一一个良心产品echarts了。非常的好用！那么我们今天就将这个作为整合到vue中，实现数据的展示功能。那么在这个之前我们要了解到在vue中一个比较重要的思想就是将这个封装成一个组键随时调用即可！！！！简化代码首先必须引入echarts 的包哦npm install echarts --save我们在在这个文件夹中引入我们要的组件

springboot + vue 前后端分离项目部署到linux服务器springboot 后端部署1、linux端服务器的话你得先安装好tomcat、mysql 以及一些最基本的java环境。这里就不在赘述，后期我会补充这一部分的操作2、接着我们要确保的是springboot端的程序是可以跑起来，然后呢，如果说你之前的数据库安装的是在本地的话那么你就要修改一下你访问的mysqld的服务器地址，如果说你之前就一步到位安装到了服务器中那么久不需要在改动！3、接着下一步操作结束之后你可以在targe

给 vue-element-admin 的登录加上一个滑动验证码的校验功能在设计登录功能的时候我们会加上一个验证码的校验功能做进一步的校验！也可防止一些而已的登陆攻击！那么我们今天就进行将vue-element-admin 登录的时候加上一个滑动验证码的校验，好吧，先上效果图，如果是你想要的那种效果那就继续往下看，不是话就不用浪费时间了！！！效果图首先先添加的这个plugins中的js文件import VabVerify from 'zx-verify'import 'zx-verify/d

vue-admin-element 整合百度的地图实现地图标记因为项目的需求，老板要求我们在首页做一个联系我们的界面，里面包含地图信息和联系人的基本信息。且这边的地图不是一张图片。上博客看各位博主的各种方法但是就是还原不出来！或许是我太菜了吧，没办法只能硬着头皮看开发手册！！！1、效果图先看一下我做出来的效果图，如果正合您的胃口那么请您悉心看完，你也可以做出一样的来！！！！2、首先申请一个百度地图的ak（密钥）...

vue 修改logo实现展示自定义的logo在vue-element-template 二次开发的时候，肯定是要把默认的logo给换成自己的logo让这个项目看上去就是自己的“一次开发”！开干！首先找到这个文件夹的位置打开index.html文件，在方框的位置替换自己的 .ico 文件那么这里肯定有人会问那我怎么去找这个图标呢？接下来就是重头戏来了介绍一个阿里巴巴的iconfort 图标库（开源） https://www.iconfont.cn/plus你把这个svg下载下来再用另一个转

[Vue warn]:Invalid prop: type check failed for prop “data”. Expected Array, got Object要处理这个bug就必须先明白这个bug到底是什么类型是怎么一回事，那字面意思就是说：这是一个非法的数据类型，本来期望的是得到数组但是你给了一个对象。好就到这，问题就很明了，那就是你给的对象要转换成数组了。然后就开始转换，这网上很多的解决方法我就不说了。我来讲讲一个我觉得更简单的解决方法。首先这是我们定义好的接受的格式 report:

Springboot+Pagehelper+Vue 完成分页显示操作在开发的过程最常用也是最常见的就是表格的分页查询了，在开发的时候碰到了这个需求，所以今天讲讲怎么把Pagehelper集成到SpringBoot并结合前端框架Vue，完成分页的操作！1、后端Springboot首先先在pom加上Pagehelper的依赖 <!-- pageHelper --> <dependency> <groupId>com.gith

element-ui 实现三个选择框省市区的联级查询1、前言在开发的项目中我们肯定会碰到要我们填写省市区的信息，一般都是自己选择的，不会说让我们自己输入，因为自己输入就会让我们的项目感觉上有点像小demo一样，那么我们究竟该怎么去是实现这个功能呢？翻阅借鉴许多博主的优秀博文，那么我总结出一些做这个的套路。首先引入地区数据dispicker.js 如下(function (factory) { if (typeof define === 'function' && defin

在数据加载时加入 Element-UI 的 Loading 组件在开发过程中，小伙伴们一定都遇到过当你在一个页面跳转到数据详情页面的时候，发现这个数据量特别大的时候，页面在加载数据的时候需要很长一会的时间，跳转过去的时候会出现白屏不显示，这样就会显得非常的难受，会给用户造成体验感不好的错觉，那么怎么样能够更加平稳的过度过去呢？我翻看了elementUI 的手册 看到了loading 这个组件，可以完美的解决我们上述的问题，是页面跳转的时候显得更加的顺滑，增强用户的体验！废话不说，开整！ created

vue 对时间的格式化处理在开发过程中碰到了一个关于时间格式化问题，要将现在的时间格式化成YYYY-MM-DD 的需求。翻阅很多博主写的答案层次不起，我以自己的需求总结一个最简单完成时间格式化的需求的格式。//首先必须要确保是否在项目中引入了 moment这个源，如果没有npm 引入npm i moment --save//刷新一下npm install//在重新启动一下项目npm run dev//子项目中要使用的页面引入momentimport moment from 'moment'

vue关于从页面A跳转到页面B再跳转回到页面A，参数保持不变在做项目的时候难免会碰到多个页面之间的跳转传值，但是需要重新回到最开始的页面时最初的页面的参数还在的问题。那么这个问题就要涉及到一个浏览器的LocalStorage —前端存值三大哥之一，它可以自由的设置保存值的时长。我们要在页面A中把值设置进去然后在要取出来的页面取出来。//把值设置到localstorage中window.localStorage.setItem('aaa',xxx);// aaa指的是存值的符号// xxx 指的是

问题描述我们在做项目的时候经常需要对图表中的数据进行显示那么就不得不运用到tooltip 这个配置项，他默认有显示但是我们有时候需要自定义这个label显示标签，效果图如下图所示：如果你也想跟我一下自定义显示两个自定义标签的话那么久继续往下看，实现很简单~~解决办法 tooltip: { trigger: 'axis', axisPointer: { type: 'cross' }, //自定义显

问题描述在开发的过程中难免在数据库中返回的时候没有对应的值可能会不存在这个值或者是 null、undefined、空串、NaN 但是我们就不需要这个数据，所以我们必须把这个多余的去除掉。如图所示：方法 let arr = this.res.map(item => item.weekX) this.weekX = arr.filter(Boolean)结果搞定~...

效果图如果大家想实现如下图的效果那么久继续往下看吧，直接上动图！方法因为项目需要展示的数据图表比较多我选择的是把每一张图表封装成一个vue组件来引用。先上一个完整的代码，引用时注意在从数据库获取数据是要换成自己的数据库以及要自己定义好你需要的对象加到你设定好的数组中：<template> <div> <div id="main" style="height:350px;width:100%"></div> </div>

需求分析我们在做表格的时候经常需要将不正常的数据显示出来，所以我们这个时候就需要将这个数据变换一个显眼的颜色显示出来。可以是用户快速的看到重要的数据。首先查看element-UI 可以知道这边可以对行和列进行操作直接上代码：1、现在表格中绑定一个cellStyle方法 <el-table :data="tableData" style="width: 100%" class="customer-no-border-table"

问题说明在开发项目中经常要从数据库中拿到数组然后复制给新的数组使用，但是会发现有时候会发现带有 __ob__: Observer 数组后缀的就是没有办法取到值，更可怕的是 console.log 却能看得到值。数组如下图所示：解决问题那么针对这样的问题博客上基本上都是说要将数组转化成string对象运用这个JSON.parse(JSON.stringify(数组))再进行赋值，然后一顿操作数组变成空！！！ 说实话根本不是这个原因，哎被坑了一下午！那么首先先解释一下为什么数组后面会出现__ob__:

首先在做项目的时候有时候我们在数据图中的数据很多但是我们在前端的进行Echarts 图标中并不需要那么多的数据，这就会使得我们从数据库中返回的数据变得很冗余，所以想到能不能把他变成一个我们自定义的Json对象加大我们所需要的数组中那么就大大的减少了数据量。那么如何自定义一个Json对象并加到数组中去呢？？？？解决方法我们首先要定义一个空数组和空对象，空数组用来装我们的对象，对象就是用来接收我们所需的键值对了，上代码 //创建一个数组 let res = [] //创建一个对象

问题描述在实际的前后端开发问题中最重要的是怎么将这两个端连接起来完成通信，又因为这个两个又可能不是布置在一台服务器中那么就必然会有跨域通信的问题！那么该怎么解决呢？？？（好吧，这其实是我在总结项目的时候忘了发出了~）具体如下先在springboot 的创建一个config 文件夹然后在添加这个跨域的文件 CrosConfig.java 如下图所示：代码@Configurationpublic class CrosConfig implements WebMvcConfigurer {

集合、数组、String 等类型判断是否为空（vue和java对比）集合 //判断集合是否为空(java) list.size() == 0 list.isEmpty() //判断集合是否为空（Vue） //在vue中的话加括号会使得size()和isEmpty()变成方法 list.size == 0 list.isEmpty 数组 //判断数组是否为空(java) arr.length() == 0 //判断数组是否为空(Vue) arr.length == 0总结一

解决vue elementUI 日期选择器提交springboot后端数据时报400错误（已解决）首先要明白报400错误就是前后端数据格式不匹配，报这个错误的主要根源就是在于前端通过axios打包之后数据格式会发生变化与后端的不符，从后端打印的信息可以知道，后端要求的是date（yyyy-MM-dd）格式的但是传过去的是String的格式，所以我要在vue前端对日期进行格式化处理之后就可以解决这个400问题。问题解决！！！！...

Vue 父子组件传值问题父组件给子组件传值父组件： parent.vue 子组件：child.vue<template><child :v-bind:dataDtetail="dataList" /></template>//首先需要在父组件中引入子组件<srcipt>import child from '子组件存放的位置'export default {components:{child},data(){dataList

在vue-element-template 的登录页面添加注册功能页面最近在使用 vue-element-template 模板开发一个小项目，现在想在登录页面中添加注册的按钮并实现注册功能，但是找了很久没找到相关的资料，所以我就慢慢的研究手册，解决了这个问题！首先我们要了解到的时候vue-element-template这个开发模板是已经给我做好了登录拦截的功能，也就是说你只有在登录的了才能去访问他的其他页面，他只开放了"/login"这个接口。那么我现在现在要在登录的界面添加注册的按钮并实现页面的

改造vue-element-admin 的登录功能，变成从后台数据库中验证登录首先了解登录时前段需要什么样的数据要知道vue-element-admin 这个后台开发模板是集成非常多我们日常开发网站的基本功能。所以我们在改造登录功能的时候首先要明白vue-element-admin 需要后端提供什么样的数据才能完成后端的校验完成登录。如下图：从图中可以看到登录的时候必须后端会根据你的请求给你的返回一个状态码：20000 token令牌 success 成功的信息。再接着我们查看vue-eleme

Field m_chechService in com.cjhstudy.controller.CkeckController required a bean of type ‘com.cjhstudy.service.M_CheckService’ that could not be found.Action:Consider defining a bean of type ‘com.cjhstudy.service.M_CheckService’ in your configuration.解决

如何将数据库中text字段中返回的数据转换成数组的形式，并且将字符串的数字转换成数字的形式显示数据库text字段数据库中的text字段在前端 界面返回的时候是成字符串的形式的，类似于下图那么，在我这个项目中我需要将text文本中的数据取出然后在echart的折线图中显示出来的。那么我们首先的明确echart显示的数据必须是数组形式的数字 ，那么我们接下来要做的就是将输出到前端的这一串字符串进行分割和转成数字处理。将字符创分割转成数组形式并且转换成数字形式废话不多说直接上代码！！！！ //将tex

vue-element-admin 根据不同的角色权限展示不用的左侧菜单栏前言本人最近在完成一个小项目，项目要求根据不同的角色能够在首页中的菜单栏中显示这个角色权限能够访问的菜单。查了好多资料讲的都差不多，可能是我太菜，没有看懂。所以我就开始结合这源码搞清楚这个权限验证的一个流程。需要用到的几个文件src/permission.jssrc/store/modules/permission.jssrc/store/modules/user.jssrc/router/index.jssrc/co