- 博客(25)
- 收藏
- 关注
RSS订阅
原创 vue+element ui实现树形表格加复选框（checkbox）
element ui中有带复选框的表格和树形数据的表格，不过呢，wo遇到一个新的需求，其中就是要实现树形表格和复选框的结合，尝试过很多方法，最后自己总结出一套，实现了全选，单选，多选。效果图：代码部分 <el-table ref="multipleTable" :data="tableData" style="width: 100%" row-key="domainId" :default-expand-all="
2021-03-08 16:42:24
4375
10
原创 vue form表单中嵌套table表格实现逐行的输入框校验
先看效果图：需求是：后面的记录值input输入框失去焦点就进行校验，如果不为空的时候要满足前面记录类型（是个select）的选择项，不同的选择项input的校验不一样，直接是上代码： <el-table-column label="记录值"> <!-- :rules="fromaRules.rember" --> <template slot-scope="scope"> <!-- &
2021-03-06 11:13:22
2824
原创 vue+element ui中操作table表格，双击实现行内编辑
最近开发项目，关于表格的数据操作比较多，这个地方个人觉得比较难搞，特此记录一下如上图所示，双击行可以编辑，编辑取消的时候，这一行恢复为编辑前的数据，这个地方用到对象的浅拷贝，点击取消的时候可以拿到这一行数据（row），通过以下方法实现： //双击可编辑 cellClick(row) { this.$set(row, "show", true); row.hostRecord_cache = row.hostRecord; row.recordType_cac
2021-03-06 10:35:30
3219
4
原创 vue+element ui 计算开始时间和结束时间相差天数
vue+element ui 计算开始时间和结束时间相差天数话不多说，直接上代码getDateTime(date) { var dateSpan, iDays; let sDate1 = Date.parse(getDateFilter(date[0].getTime())); let sDate2 = Date.parse(getDateFilter(date[1].getTime())); dateSpan = sDate2 - sDate1;
2021-02-21 17:46:27
3122
原创 vue中校验服务器地址，域名的正则表达式
vue Element ui中IPV4，IPV6服务器地址，域名的校验IPV4:例如（192.168.0.1） const reg = /^((25[0-5]|2[0-4][0-9]|1[0-9][0-9]|[1-9][0-9]|[0-9])\.){3}(25[0-5]|2[0-4][0-9]|1[0-9][0-9]|[1-9][0-9]|[0-9])$/; if (!reg.test(this.searchMap.inputVal)) { this.
2021-02-07 15:00:08
3339
原创 v-model修饰符.lazy用法
v-model一般是用在input输入框的双向数据绑定上1.v-model不加.lazy修饰符：<template> <div> <div> <input v-model="msg" @change="show"> <span>{{msg}}</span> </div> </div></template><script>expor
2020-12-09 10:17:41
4809
3
原创 react 动态渲染img 的src
注意：src直接require(../../image/a.png)图片不会出来，用三元判断一下，加一个默认的图片就好了。
2023-12-08 14:50:47
379
原创 向后端发送axios请求，下载excel表格数据
vue.js中前端通过请求下载excel表格数据 exportChange() { exportDnsAnalysisStatistics( this.format, this.searchMap.startTime, this.searchMap.endTime, this.tname ) .then((res) => { // const fileName = "解析记录表
2021-02-21 17:55:24
249
原创 vue中el-input校验输入多个域名时，其中某一个域名不正确的正则校验
index.vue <el-form-item prop="realmName"> <el-input type="textarea" placeholder="输入一级域名，每行一个，最多可输入500个域名。例如：qcloud.com qq.com " v-model="addDomain.realmName" :class="{ err: errDomainArr.length !=
2021-02-07 15:23:23
836
原创 vue+element-ui中使用Drawer出现黑色边框
在vue中使用Drawer，页面一加载，header会出现黑色边框，点击Drawer内部，整个抽屉外部会出现黑线，不过header黑线消失，试了好多次，加以下样式避免踩雷：去除header黑线：.el-drawer /deep/ :focus { outline: none;}去除抽屉黑线：.el-drawer:focus { outline: none;}注意：在style中加了scope这样设置不生效...
2021-02-04 15:28:40
2549
原创 vue中使用vuex的小案例
vue中使用vuex首先新建一个vue的项目，个人觉得这样结构比较清晰，放在现有的vue项目中也可以的，但是不要搞混乱了哈！这个案例是父子组件调用vuex中的数据，相互影响，相互独立。项目结构如下，在components下新建Parent.vue和Child.vue，新建store文件夹，放index.js文件1.Parent.vue<template> <div class="parent"> <h3>这是父组件</h3> &l
2020-12-07 18:03:13
311
原创 vue脚手架搭建项目
vue创建新项目第一步：安装node.jsNode.js 官方网站下载：https://nodejs.org/en/打开控制命令行程序（ctrl+r-----cmd），node -v查看node.js版本，npm -v查看npm版本推荐使用淘宝NPM镜像$ npm install -g cnpm --registry=https://registry.npm.taobao.org这样就可以使用cnpm命令安装模块了第二步：安装vue-clicnpm install vue-cl
2020-12-07 17:44:37
119
原创 git 常用操作
创建远程分支并提交代码首先找到项目文件夹，右键打开Git Bash Here：git branch -r 查看所有的远程分支git checkout -b dev(dev为创建的远程分支名)git push --set-upstream origin dev //dev为创建分支的名字现在查看远程仓库已经有新建的分支了，并且新建分支有test分支上的代码(test分支为当前正在使用的分支)git拉取远程分支代码到本地5. 新建一个文件夹，右键打开Git Bash Here：
2020-12-01 18:03:52
75
原创 vue中调样式的坑之嵌套弹窗
1.vue中同一个页面有多个dialog弹窗（包括嵌套的弹窗），样式不生效或者遮罩层的问题解决：在内层dialog上加append-to-body属性，内层dialog样式修改，在内层dialog外包一层div并加class类 如果这样写样式不生效，把嵌套的dialog改为两个dialog并列2.vue中多个页面用到同一个组件，修改组件样式在当前页的全局样式中修改，不加scoped，但是要加上父级div的类名避免样式全局污染3.loadsh js实用工具库，它内部封装了诸多对字符串、数组、
2020-11-20 11:38:18
1428
原创 微信小程序渲染富文本
微信小程序渲染富文本（html标签）先在github上面下载WxParse，复制在本地的文件夹里面先在wxml引入WxParse：然后在js里面引入并配置：var WxParse = require(’…/…/…/wxParse/wxParse’); WxParse.wxParse('article', 'html', article, that, 5);接下来在wxml要使用的地方直接使用就可以了：如果后端返回的数据比较复杂，如[{}]格式，需要做处理，入下：再渲染：
2020-11-10 11:52:26
567
原创 微信小程序之多张图片上传
微信小程序之多张图片上传（wx.uploadFile）// 选择图片saveImg() {let that = this;var pics = [];let imgLis = that.data.imgLis;if (imgLis.length < 5) {wx.chooseImage({count: 5,sizeType: [‘original’, ‘compressed’],sourceType: [‘album’, ‘camera’],success(res) {// c
2020-11-09 17:12:26
932
原创 微信小程序button按钮样式修改不起作用
微信小程序button按钮样式修改不起作用找到app.json文件，删除**‘style’:‘v2’**就可以了
2020-10-22 10:24:02
814
原创 开发原生微信小程序之清除缓存
开发原生微信小程序之清除缓存遇到这个问题的时候，真的是很奔溃，我的电脑是windows系统，安装微信开发者工具，结果发现在开发过程中每次修改代码，要编译看效果的时候都不起作用，后来发现要清除缓存（每次编译都要清），如下图：这种方式可以解决编译后没有效果的问题，不过只要你写的代码出错，在控制台报错，明明你已经把错解决了，清除缓存编译也没有效果，在我多次尝试下发现关闭项目重新打开，报错就没有了，可以继续清除缓存后编译，可是这样太难受了，后来，我发现在安装微信开发者工具的时候，大多数人都会安装稳定版本，我也
2020-10-21 17:12:29
2324
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人