- 博客(34)
- 收藏
- 关注
RSS订阅原创 复盘学习 2024
lazy 修饰符: 使模型绑定的数据只有在失去焦点或者是按下回车时才会更新number 修饰符: 使输入框中输入的内容自动转换为数字类型trim 修饰符:1.只去除两端空格2.只要有空格就去除或者。
2024-03-22 18:11:47
940
原创 Vue + AILabel.js 实现图片标注
一、网址以及demo官方文档：AILabel与你一路同行demo地址1：AILabel-标注篇demo地址2：AILabel示例一览二、我的实例代码（vue环境下）三、完整代码 首先 npm i ailabel <template> <div> <div id="map"> <div class="button-wrap"> <button class="btn btn-defau...
2022-03-17 15:39:40
15493
23
转载 2022/2/24 template上使用v-for时报错解决
将 v-for 写在 template上时，template上不能使用key,但 v-for 必须要指定key，所以循环遍历的元素上，需要加上key(key是唯一标识，不允许重复)同一标签上，不能同时使用v-for和v-if，怎么办？<ul> <template v-for="(item,index) in ['国庆节', '春节', '元旦']"> <li v-if="item !== '春节'" :key="index">{{
2022-03-09 18:15:39
1922
2
转载 2022/2/23 element-ui el-table 展示多列重复数据
项目中显示表格，内容只有两列数据，所以当数据很多的时候，可以在页面上一行显示多列重复表头。如下图所示：使用vue + element UIjs代码export default { data() { return { tableData:[ {name:'Wer ist Justin Bieber ',type:'alarm'}, {name:'Wer ist Justin Bieber '
2022-03-09 18:07:19
1565
原创 2022/1/20 一些样式
演示图html <div class="bg"> <div class="drop-shadow"> <div class="glass"></div> <span>GLASS</span> </div> </div>css.bg { display: flex; justify-content: center; height: ..
2022-01-20 15:00:47
294
原创 2022/1/20 好看的loading
演示html<div v-if="show" class="bg"> <div class="boxLoading"></div></div>css.bg { // width: 100%; position: absolute; left: 0; right: 0; top: 0; bottom: 0; height: 100%; background-color: rgba(211, 2
2022-01-20 10:35:37
141
原创 2021/1/19 好看的前端登录界面
演示图完整代码<template> <div class="big_box"> <div class="box"> <h2>Login</h2> <form> <div class="inputBox"> <input type="text" name="" required="" /> <label&
2022-01-19 16:38:43
1917
原创 2021/12/23 基于 vue element ui 封装的 X轴标题 Y轴标题 自定义表格
基于 vue element ui 封装的 X轴标题 Y轴标题 自定义表格
2021-12-23 17:06:33
668
原创 2021/12/10 根据id查找所在数组的索引值
关键代码var index = nn.map(item => item.a).indexOf(33)使用场景：使用ele的表格，进行在任意位置插入空行，需要获取到当前点击行的索引，以及id,给新行赋值id+0.1，以便区分是后增加的。所以需要再根据id查找到新增行在数组中的索引值进行数据的修改操作新增行操作实现export default { name: "", data() { tableData:[], //原table数组 addLine: {
2021-12-13 11:27:19
1560
原创 2021/12/10 js 时分秒转化为秒
因为后端时间数据格式是时：分：秒，需要转换成秒，所以封装了Time.js//转成秒 切保留三位export function getS(time) { var hour = time.split(":")[0]; var min = time.split(":")[1]; var sec = time.split(":")[2]; var s = (parseFloat(hour * 3600) + parseFloat(min * 60) + parseFloat(
2021-12-13 11:10:13
1012
转载 2021/12/3 HTML marquee标签
HTML marquee 元素（<marquee>）用来插入一段滚动的文字。你可以使用它的属性控制当文本到达容器边缘发生的事情。该标签是个容器标签语法：<marquee></marquee>下面这两个事件经常用到：onMouseOut="this.start()" ：用来设置鼠标移出该区域时继续滚动onMouseOver="this.stop()"：用来设置鼠标移入该区域时停止滚动代码如下:<marquee onMouseOut=..
2021-12-03 10:09:48
104
转载 2021/11/29 好看的滚动条css样式
参考地址：CSS3自定义滚动条-轩枫阁引用：CSS3自定义滚动条样式 -webkit-scrollbar_韩世雷 程序员专栏-CSDN博客_滚动条样式
2021-11-29 11:38:42
470
原创 2021/11/26 wavesurfer的使用 及插件的使用
完整代码<template> <div class="mixin-components-container"> <el-row> <el-card class="box-card" style="text-align: left"> <div slot="header" class="clearfix title"> <span>Vue框架中嵌入使用wavesurfer.
2021-11-26 14:14:40
2654
1
原创 2021/11/23 css属性选择器
因为写了全局css 设置按钮禁用之后 禁用效果不生效 所以需要修改css样式button[disabled] { /* !important 提高显示级别 */ cursor: not-allowed; //红色圆圈一个斜杠 }
2021-11-23 16:48:55
55
原创 2021/11/10 vue 图像上传 form-data
HTML <el-upload ref="upload" :limit="1" :on-exceed="limit" :on-remove="handleRemove" multiple action :before-upload="beforeUploadForm" :http-request="hand
2021-11-10 19:08:33
693
转载 2021/11/3 el-form：一行el-form-item内多个输入框的校验---【一个表单校验内的多个校验写法】
el-form：一行el-form-item内多个输入框的校验---【一个表单校验内的多个校验写法】_DcTbnk的博客-CSDN博客
2021-11-03 11:17:31
1832
1
转载 2021/10/15elementUI tabale表格中 table-column v-show失效
产品要求表格中有的列可以控制出现和隐藏，想到了用v-if 或者用 v-show 控制table-column，但实际是v-if有效，v-show无效，主要是elementUI 的table 中的table-column 里面用了display：table-cell，而v-show用的是display：none控制显示，display：table-cell的优先级高于display：none，所以v-show失效了...
2021-10-15 17:03:29
385
原创 2021/10/13 导出zip
//导出 Iexport(row) { // console.log(row,'导出'); this.$confirm("Export?").then((_) => { this.$axios({ method: "get", url: "/recording/api/business/reportzip", params: { projectId: 1, ..
2021-10-13 15:06:57
81
转载 2021/9/24 js-audio-recorder实现录音功能
开始录音// 开始录音 startRecorder() { let that = this; recorder.start().then( () => { this.disnext = true; // 绑定事件-打印的是当前录音数据 recorder.onprogress = function (params) { that.duration = params.
2021-09-24 17:39:46
1112
2
原创 2021/9/23 按钮美化-动画
统一按钮样式/* 统一按钮样式 */.small { width: 80px;}.normal { width: 120px;}.big { width: 160px;}.allbtn { position: relative; height: 40px; color: #fff; border-radius: 5px; background: transparent; cursor: pointer;
2021-09-23 09:57:06
174
原创 2021/9/18 el-table空状态
<el-table ref="multipleTable" :data="tableData" height="600" tooltip-effect="dark" style="width: 100%" @selection-change="handleSelectionChange" > //no da.
2021-09-18 11:47:51
540
原创 2021/9/18 全局自定义loading
loading.vue<template> <div v-if="show"> <div class="mask_loading"> <img src="../assets/img/loading.gif" alt="" class="loading" /> </div> </div></template><script>export default { na
2021-09-18 11:09:06
134
原创 2021/9/14 vue中点击按钮复制内容
html <span style="display: block" v-show="isALBY"> <el-button class="circle" @click="copyNum('١')">١</el-button> <el-button class="circle" @click="copyNum('٢')">٢</el-button> <el-button class="circle" @click=
2021-09-14 18:22:30
77
原创 2021/9/7 阿拉伯语倒输入
html <el-input v-model="storage.inputData" :class="{ reverse: isALBY }" :disabled="storage.userSelect != 'Yes'" placeholder="Please enter the content" maxlength="1024" @change="onChange" style="width: 80%" >
2021-09-07 13:55:50
192
原创 2021/9/2 导出文件Exel
//导出 onExport() { // this.$message("敬请期待"); this.$confirm("Export?").then((_) => { this.$axios({ method: "get", url: "/api/tasks/infoExport", params: { tcUsername: this.username, .
2021-09-02 10:25:05
43
原创 2021/9/1 js数组去重
js数组去重 this.paramTable.forEach((ele) => { if (ele.status == 0) { ele.status = "新建"; } else if (ele.status == 1) { ele.status = "可抽检"; } else if (ele.status == 2) {
2021-09-01 15:09:55
38
原创 2021/8/30 el-table fixed遇到的问题
el-table 冻结列时 出现以下问题之前.el-table { height: 680px; overflow: scroll;} 解决方法 <el-table max-height="680" :data="paramTable" style="width: 100%"> </el-table>/* .el-table { height: 680px; overflow: scroll;} */...
2021-08-30 15:44:40
164
原创 2021/8/26 el-table固定列添加点击事件
利用插槽<el-table-column label="Batch" width="400"> <template slot-scope="scope"> <div @click="goCount(scope.row)">{{ scope.row.BatchName }}</div> </template></el-table-column>传参//点击批次跳转count列表goC..
2021-08-26 17:29:38
280
转载 2021/8/25 特殊情况时将国际化内容以变量的形式写在data里
jsp<template> <el-breadcrumb-item>{{ item[this.$i18n.locale]["list"] }}</el-breadcrumb-item></template>data data() { return { item: { zh: { list: "职位列表", }, en: { l
2021-08-25 14:25:16
71
原创 2021-08-15 正则校验格式 xx:xx
//type格式限制 blurRegExp() { var reg = new RegExp(/^[a-zA-Z0-9]+\s*:\s*[a-zA-Z0-9]+$/); var res = reg.test(this.form.TYPE); if (!res) { this.form.TYPE = ""; this.$message.error("Incorrect TYPE format!"); } },.
2021-08-16 09:38:26
279
原创 2021-8-4 解决时间戳回显 --时间戳为毫秒
解决时间戳回显 --时间戳为毫秒 res.data.data.forEach((ele,index) => { //时间戳转换成日期 this.tableData[index].releaseTime = new Date( parseInt(ele.releaseTime) ) .toLocaleString()
2021-08-04 17:15:30
286
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人