- 博客(57)
- 收藏
- 关注
原创 vue获取近七天、月份、年份的起始日和结束日
在Vue的data选项中定义了selectedMonth、startDate和endDate三个变量,分别表示已选择的月份、起始日和结束日。formatDate方法用于将Date对象的日期格式化为"YYYY-MM-DD"的形式,通过获取年份、月份和日期,并使用slice()方法在需要的情况下添加前导零来确保日期格式正确。formatDate方法用于将Date对象的日期格式化为"YYYY-MM-DD"的形式,通过获取年份、月份和日期,并使用slice()方法在需要的情况下添加前导零来确保日期格式正确。
2023-08-04 16:03:09
2311
1
原创 vue+element-ui Dropdown下拉菜单(获取某行数据)
element-ui Dropdown下拉菜单 通过command方法获取某行数据
2022-12-30 15:16:39
2983
1
原创 el-input限制不能输入中文
el-input限制不能输入中文 <el-input v-model="siteUrl" onkeyup="value=value.replace(/[^\x00-\xff]/g, '')" > </el-input>
2022-05-31 14:13:24
4313
2
原创 CSS实现折角效果:
实现效果:代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &l
2022-04-21 14:05:16
1023
原创 CSS实现汉堡菜单:
代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <titl.
2022-04-20 18:08:28
928
原创 jq消息提示框
function showMessage(message,type,time) { let str = '' switch (type) { case 'success': str = '<div class="success-message" style="width: 300px;height: 40px;text-align: center;background-color:#daf5eb;;color: r
2022-04-02 14:06:01
1736
原创 jQuery动画实现图片无缝连续自动滚动
代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&.
2022-03-31 16:51:53
3455
原创 随机验证码(带干扰线)并校验提示
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>随.
2022-03-29 17:24:57
279
原创 jq设置select默认值字体颜色
$(function () { var unSelected = "#999"; var selected = "#000"; $("select").css("color", unSelected); $("option").css("color", selected); $("select").change(function () { var selItem = $(this).val(); if (selItem == $(thi
2022-03-28 14:15:29
1223
原创 vue+element 根据状态改变当行字体颜色
一、使用element中的scoped:style 动态样式 :style=“classObje(scoped.row.userOperation)” <el-table> <el-table-column label="操作" align="center"> <template slot-scope="{row}"> <el-but
2022-03-10 10:08:56
4419
原创 Vue表格实现隔行变色
1、利用v-for中的index值实现隔行变色<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge">
2022-02-18 14:59:21
3152
原创 添加功能 复选框默认选中某个值 并展示该值的数据
选择角色的复选框组 <el-checkbox-group v-model="checkedRoleGroupList" @change="checkedChangeRoleGroupHandler" > <el-checkbox name="checked_RoleGroupList"
2022-02-07 13:52:16
859
原创 [正则表达式]可以为空值,不为空则要验证格式
表单验证的时候会用到记录一下^$|你的正则式/*例如:可空 但填了必须6到16位*//(^$)|(.+){6,16}$/
2021-12-23 17:15:22
3458
原创 Element取消upload组件上传过渡效果
问题描述:Element upload组件的过渡效果影响页面的整洁,部分过渡效果如下所示:1、图片进行切换时:2、重新载入时:处理方法:在全局样式文件下,如 style.css 文件中,添加以下代码即可去除该过渡效果:/*去除upload组件过渡效果*/.el-upload-list__item { transition: none !important;}如果不行的话 试试在代码前面加上 ::v-deep 深度选择器在这里插入代码片::v-deep .el-upload-l
2021-11-19 17:13:37
1084
原创 修改element 的el-radio的选中样式变成对勾
我这个是在全局改的,在app.vue页面(用了深度选择器)#app /deep/ .el-radio__input.is-checked .el-radio__inner::after { content: ''; width: 10px; height: 5px; border: 2px solid white; border-top: transparent; border-right: transparent; text-align: cent
2021-11-01 17:35:04
1373
原创 Switch开关状态只启用一条
Switch开关状态只启用一条,其他数据为禁用状态,启用后该按钮不可进行点击操作**一、根据后端接口返回的状态,判断数据为启用或禁用 status =“1” 启用,status =“0” 禁用 ** <el-table-column label="启用/禁用" align="center" min-width="120px"> <template slot-scope="{ row }"> <el-switch
2021-10-11 17:50:21
1215
原创 vue中倒计时3秒后跳转页面
<script>export default { data(){ return { count:"",//倒计时 } }}, created(){ this.threeGo()}, methods: { //3秒后进入跳转页面 threeGo(){ const TIME_COUNT = 3; if(!this.timer){ this.count = TIME_COU
2021-09-30 16:39:02
3871
1
原创 Element-ui中input输入框远程搜索的使用方法
项目中会使用掉后端的接口来完成远程搜索,看官方文档写的可能有些繁琐,在此记录下,在vue项目中如何使用远程搜索来实现的效果图html <el-form-item label="素材名称:"> <el-autocomplete class="width250" size="mini" v-model="name" :fetch-suggestions="querySearchAsync" @select="handleSelect" .
2021-09-30 15:03:37
4068
原创 vue 报错 Object(...) is not a function
解决 vue 报错 Object(…) is not a function在做vue项目的时候 报错TypeError: Object(...) is not a function 找了半天找到了问题所在:报错描述:报错原因:1、data中的数据和methods中的方法重名,解决办法:将名字修改即可2、引入axios方法时如果没有加双括号{ }也会出现这种错误错误代码:正确代码 :......
2021-08-30 17:59:41
50905
6
原创 修改checkbox默认样式
checkbox默认样式:修改checkbox默认样式html部分<label><input type="checkbox">选择框</label>css部分使用伪类元素对checkbox样式进行修改边框样式在before中修改,"\2713"为字符表勾选字符input[type="checkbox"] { width: 20px; height: 20px; display: inline-block; text-align: cen
2021-08-26 15:43:49
737
原创 Vue实现复选框的多选与全选
Vue实现复选框的多选与全选代码如下: <div id="app"> <table> <tr> <th> <!-- 这是全选复选框(即选中了这个复选框,所有选项复选框都被选中),其绑定数据的v-model为checkedAll,并绑定了改变事件changeAllChecked --> <input type="ch
2021-08-26 15:10:52
9593
原创 vue防按钮频繁点击(自定义指令)
频繁点击就会频繁触发请求,为了避免这种情况,可以自定义指令来实现在main.js中写以下代码// 复制粘贴在main.js里// 自定义指令:解决element-ui按钮重复点击Vue.directive('preventReClick', { inserted(el, binding) { el.addEventListener('click', () => { if (!el.disabled) { el.disabled = true .
2021-08-26 11:36:09
533
原创 echarts饼图渲染后台返回数据
//假设这是后端返回的数据结构{ "code": 1000, "msg": "请求成功", "data": [{ "appNumber": 195, "appName": "其他" }, { "appNumber": 3, "appName": "平台" }, { "appNumber": 27, "appName": "上报" }, { "appNumber": 134, "appName": "admin" }, { "appNumber": 4176
2021-08-24 10:52:27
1850
原创 GoJS使用以及去除水印办法
1. 首先通过npm命令添加 go.js 插件 npm install gojs --save默认应该安装的最新版本, 如果需要安装指定版本,则通过指定命令版本或者通过修改Package.json 文件修改其对应版本。2. 安装完成后则启动时可能会报错,提示less-loader 错误这个时候是因为本地的Less-loader 版本过高,不兼容,所以需要卸载之前的Less-loader 版本然后重新安装兼容版本即可。以我的文章为例, 我是安装的less-loader 6.0 版本 因为过高。我将其卸
2021-08-12 17:13:35
2289
2
原创 vue标签内循环数据最后一个逗号不显示
后端返回的数组数据直接循环数据的页面展示在代码中直接加上一个逗号的效果这样是不行的 <span v-for="(item,index) in row.lineSet" :key="item.lineId" > {{ index == row.lineSet.length-1 && item.lineName || (item.line
2021-07-07 11:09:59
1106
原创 element中修改input样式失效的解决办法
::v-deep 深度作用选择器更改input框样式无效可以试试::v-deep::v-deep .el-input__inner { background: transparent !important; border: none!important; border-radius: 0px!important; border-bottom: 1px solid #9FA6B3!important;}...
2021-06-28 14:14:46
2638
4
原创 VSCode设置git账号和密码
一、选中文件–>首选项–>设置二、搜索git,找到setting.json三、在setting.json中添加"git.path":"D:/soft/git/Git/bin/git.exe"四、git bush中设置Git 全局设置:git config --global user.name “用户名”git config --global user.email “用户邮箱”五、设置让VSCode记住git账号和密码git config --global credentia
2021-02-01 16:57:52
30600
原创 Vue2.0选中当前鼠标移入删除
效果如gif动态图所示:1、通过v-for遍历数组HTML代码:<template> <div class="nav"> <div class="nav-item" v-for="(item,index) in items" :key="index" @mouseenter="mouseEnter(index)" @mouseleave="mouseLeave" :class="{active:index==isActive}">
2021-02-01 10:51:48
528
2
原创 接口测试常用工具及测试方法
接口测试常用工具及测试方法一、首先,什么是接口呢?接口一般来说有两种,一种是程序内部的接口,一种是系统对外的接口。系统对外的接口:比如你要从别的网站或服务器上获取资源或信息,别人肯定不会把数据库共享给你,他只能给你提供一个他们写好的方法来获取数据,你引用他提供的接口就能使用他写好的方法,从而达到数据共享的目的,比如说咱们用的app、网址这些它在进行数据处理的时候都是通过接口来进行调用的。程序内部的接口:方法与方法之间,模块与模块之间的交互,程序内部抛出的接口,比如bbs系统,有登录模块、发帖模
2021-01-29 13:36:38
1316
原创 Vue项目开发需要准备和配置些什么环境?
Vue项目开发需要准备和配置些什么环境?一、首先需要安装node.js下载:安装node.js链接 安装在D盘window+R,输入cmd,打开命令提示符窗口,输入:npm -v检测是否安装成功,如果输出版本号,则表示安装成功,如图:npm包管理工具(package manager)自动安装完成二、改变原有的环境变量1、首先配置npm的全局模块的存放路径、cache的路径,此处我选择放在:D:\Program Files\nodejs输入如下命令:npm config set
2021-01-28 17:08:01
9694
原创 点击标签栏动态改变页面数据
给标签栏一个点击事件<view class="nav-2" v-for="(item,index) in tabBars" :key="index" :class{'active':index==Aindex}" @click="qh(index)"> {{item.classname}}</view>在methos事件方法中 qh(index) { // 获取到点击标签的下标 console.log(index) uni.req
2020-10-14 19:02:41
419
转载 vue中请求的数据 时间戳转换时间
前言下面是vue中将请求的数据中的时间戳 转化成标准时间,下面是我总结的两种方式:第一种方式:这里是在vue请求的数据中将时间戳转换字符串的这是代码中的关键部分//item.add_time 为请求数据中的时间戳var date = new Date(parseInt(item.add_time) * 1000); item.add_time = `${date.getFullYear()}/${date.getMonth() + 1}/${date.getDay()}
2020-10-14 17:21:20
11605
5
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人