- 博客(21)
- 收藏
- 关注
RSS订阅原创 vue Tooltip提示动态换行问题，间隔指定字符数换行
使用element 组件el-table，表格某一列字段过长，采用el-tooltip进行提示，但提示中的内容过长不能换行展示。
2023-06-01 11:11:18
2220
原创 使用AES-256-ECB加密，运行时报错 Illegal key size or default parameters
使用AES-256-ECB加密，运行时报错 Illegal key size or default parameters
2022-07-08 11:38:56
646
原创 文字轮播+淡入淡出效果
需求描述：将列表中的数据循环展示，每间隔指定时间显示一行，且每次需要以淡入淡出形式变化。实现效果：实现思路：淡入淡出效果使用<transition>标签实现，<transition> 中间需要包住有v-if或v-show的div </transition><template> <div class="index-content"> <div class="title"> <div
2021-12-30 15:27:07
700
1
原创 vue通过变量名的字符串形式，获取在data中声明的变量
问题描述：在data中声明了多个变量：如（tagEdit :false）。因为变量名后半部分重复，触发点击事件时，只传前缀（如 tagEdit，@click="click('tag')"）HTML部分：解决方案：接收后获取并且改变变量值，`${变量}`是一种字符串拼接的写法//正常获取时：this.tagEdit = true，拼接字符串获取：this[`${tag+"Edit"}`] = true实现效果：通过点击事件控制页面内容显隐，(click方法中，变量为..
2021-12-21 18:21:48
2189
原创 ElementUI 文本内容不能自动换行，内容超出显示（遇到中文、空格才会换行）
问题（如图）：文本超出显示范围，尝试其他几种情况后发现，当文本中无空格和中文时，才会出现下图中的情况解决方案：设置 div 强制换行<div style="word-break: break-all"> zxcvbnmasdfghjklpoiuytrewq|zxcvbnmasdfghjklpoiuytrewq|zxcvbnmasdfghjklpoiuytrewq</div>其他：举例一下几种可以正常换行的情.
2021-11-10 15:12:21
4304
原创 vue项目搭建（前提是已经安装了node的环境）
（ps:npm 安装教程可参考以下地址：https://www.cnblogs.com/goldlong/p/8027997.html）项目搭建1.选择新建项目磁盘目录及文件夹：C:\Users\LENOVO>E:E:\>cd IdeaProjects2.新建目录：vue init webpack test-project,选择项目配置以上选项不清楚的，可参考以下地址：https://www.jianshu.com/p/32beaca25c0d3.搭建完..
2021-09-03 10:13:18
167
原创 根据文件后缀名显示对应类型缩略图
功能需求根据后台接口返回数据中的文件路径区分文件类型，并将对应的图标（缩略图）显示在文件名称前实现效果代码片段HTML：（以下为项目中截取的部分代码） <div class="item" v-for="(item, index) in dataList" :key="index"> <div class="flex itemsCenter justifyBetween"> <svg-icon v-if=
2021-07-22 18:18:26
1208
1
原创 “http://”与“http%3A%2F%2F”，转义与解析
将URL作为参数传递，需将URL进行转义，可以使用JS中提供转义字符串和解析字符串的方法转义字符串（encodeURIComponent）let url = 'http%3A%2F%2Fm.test.com%2Flogin'url = encodeURIComponent(url)console.log(url) // http://m.test.com/login解析字符串（decodeURIComponent）let url = 'http://m.test.com/log.
2021-07-21 16:04:52
34900
原创 Vue子组件给父组件传值 + 父组件调用子组件方法结合
在开发中经常遇到关于子父组件之间传值和方法调用的问题，因此将上述两种方式结合作为例子记录下来。功能需求：通过切换左侧侧边栏（以下简称left），右侧对应显示相关内容（以下简称right）实现思路：将left和right分别封装为自定义组件，left切换时调用change事件，将id值传回父页面，再由父页面调用right中获取列表的方法代码片段：left.vue<template> <div class="left-content"> <
2021-07-13 21:03:07
299
原创 基于FullCalendar日历插件实现演播室（会议室）使用情况查看
功能需求：演播室预约申请后，以视图（日历）形式显示当天各个录课室的占用情况实现过程：安装插件npm install --save @fullcalendar/core npm install --save @fullcalendar/resource-timeline npm install --save @fullcalendar/timeline引入import FullCalendar from '@fullcalendar/vue'import resourceTi
2021-07-02 16:55:08
1690
6
原创 vue 页面渲染之后列表中对象值改变视图不更新问题
1、数组变异方法可触发vue重新渲染如push()、pop()、shift()、unshift()、splice()、sort()、reverse()等例：letauto=this.page.records[i]; auto.compressSchedule=ret.data; this.page.records.splice(i,1,auto);2、使用vuekey实现标签中传递:key="变量",每次需要重新渲染时改变变量值即可3、强制更新数据this.$...
2021-07-02 13:55:20
383
原创 iview下拉选/时间框类的被遮挡，不能展现在页面外的情况
给标签添加属性 :transfer="true" 即可<DatePicker format="yyyy-MM-dd" split-panels placeholder="选择日期" :options="options" :transfer="true" v-model="item.saleEndTime"></DatePicker>
2021-07-02 13:49:54
1019
1
原创 引入vue-quill-editor插件，实现多个富文本编辑器的使用
功能需求：在同一页面引用多个富文本编辑器问题：最开始考虑使用wangEditor，但发现上传图片时位置错乱，每次都会上传到最后一个编辑器上（如图1所示）于是更换vue-quill-editor插件，问题得到解决。图 1解决方案：1.安装npm install vue-quill-editor --save2.在 main.js 引入import VueQuillEditor from 'vue-quill-editor'Vue.use(VueQuillEdito
2021-07-02 11:41:08
2316
原创 MyBatis-plus 自动分页total数不准确问题
问题描述：代码中使用了MyBatis-plus的page分页，列表查询sql单独运行时正常且查询条数正确，但最终返回到页面上page的total条数与查询总数不一致。产生原因：使用mybatis-plus分页时会对sql进行自动优化，正常情况下使用不会产生问题，但当sql中使用聚合函数时（常用聚合函数如COUNT()、AVG()、MAX()、MIN()等），会导致查询条数不准确。解决方案：禁用自动优化(在实现类中添加 page.setOptimizeCountSql(false)，例子.
2021-07-02 10:07:30
4045
原创 vue 二维码生成与下载
1.安装npm install --save qrcode2.引入<el-button type="primary" style="float:right" @click="downLoad">立即下载</el-button>import QRCode from 'qrcodejs2' data() { return { callUrl:'https://www.baidu.com/' } },created() {
2021-07-01 17:47:02
95
原创 vue使用clipboard插件实现文本复制
本例应用场景为，二维码链接复制1.安装npm install clipboard --save2.新建js文件 clipboard.jsimport Vue from 'vue'import Clipboard from 'clipboard'function clipboardSuccess() { Vue.prototype.$message({ message: '复制成功', type: 'success', duration: 1500 ..
2021-07-01 17:30:23
281
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人