- 博客(215)
- 收藏
- 关注
RSS订阅原创 elementui tabs动态渲染+锚点滚动定位
到这里都没问题，滚动和锚点定位出现问题：在视图渲染的时候所有的tab对应下方dom在初始化的时候都进行了创建，也就是上方tab的显示隐藏没有联动下方dom，导致tab无法一个对应的关系，现在锚点出现错乱问题。我这里解决办法：把对象属性isShow为true（显示）重新组成新数组，组成tabs数组结构，然后下方dom通过上方一个ref属性 找到对应关系进行锚点展示。第一版：tab是固定的，然后点击不同tab定位当前tab下内容进行展示，滚动鼠标滑轮上方tab高亮定位是某个tab下的内容。
2025-09-08 09:39:10
459
原创 vue2前端mock h5扫码签字图片上传，websocket通信获取回传图片地址，再web端进行展示
vue2前端mock h5扫码签字图片上传，websocket通信获取回传图片地址，再web端进行展示
2025-08-26 15:08:41
419
原创 vue2使用element中多选组件el-checkbox-group，数据与UI更新不同步
vue2使用element中多选组件el-checkbox-group，数据与UI更新不同步
2025-05-27 17:06:57
727
原创 vuejs处理后端返回数字类型精度丢失问题
之前以为只有id这种LONG型长度不够的时候，会有精度丢失问题，后端会把返回的数据类型从数字改为字符串，解决此类问题。现在是这种5.00的数据类型vue再渲染的时候也会自动处理，再不改变后端数据类型的情况下，前端可以手动修改一下，保证和后端返回的数据格式一致。
2025-05-20 14:22:50
589
原创 vue element使用el-table时，切换tab，table表格列项发生错位问题
doLayout需要注意的事项：我这里是通过组件使用的table组件，涉及多层组件封装问题，所以找这个根组件ref找到doLayout方法的时候需要注意写法<el-tab-pane label="统计" name="first"><leftTable<el-tab-pane label="明细" name="second"></el-tabs>// 其中leftTableRef是el-table的ref// 切换 tab请求接口// 其中rightTableRef是el-table的ref。
2025-04-24 10:24:24
692
原创 前端上传大文件，后端报错Content-Type ‘application/octet-stream‘ is not supported【解决】
【代码】前端上传大文件，后端报错Content-Type ‘application/octet-stream‘ is not supported【解决】
2024-11-11 14:45:30
2973
原创 js数组中元素转为对象形式
var params = [];var info= { "uid" : "21", "url" : "https://wx-dev-image.wanxue.cn/WEB/basic-manager/company/image/20220520/f1fd9d784ccd45b39417178acb3b30a6.jpg", };console.log(info);params.push(info);console.log(params);var params = [];var inf
2022-05-20 16:59:53
1184
原创 vue获取循环dom节点
<template> <div v-for="(item, i) in programmeList" :key="item" class="special-l-one"> <span class="special-l-one-name" :ref=" (el) => { if (el) specialNameArray[i] = el; } " &g
2022-05-11 17:49:18
1928
原创 element input输入只能为数字问题
需求：只能输入数字问题：这种写法 能限制只能输入数字，其他字符不能输入，但是如果输入中文字符之后，v-model绑定的值不再更新了，再次输入的数字字符不再绑定到当前值上<el-input v-model.number="ruleForm.comment" clearable maxlength="5" oninput="value=value.replace(/[^\d]/g,'')" placeholder="请输入排序值(最大值99999)" ref='inputTes
2022-04-21 10:30:07
1982
原创 正则使用花括号
1.花括号使用描述：在正则表达式中 {} 是一个量词, 常用来一个或一组字符可以重复出现的次数.[0-9]{4,4}[0-9]{2,4}[0-9]{2,3}如上，三个例子可以看出1.表达式 [0-9]{4,4} 匹配 四 位 0-9 之间的数字.2.表达式 [0-9]{2,4} 匹配 二到四 位 0-9 之间的数字.3.表达式 [0-9]{2,3} 匹配 二到三 位 0-9 之间的数字.注意花括号左侧数字必须小于右侧{5,3}量词范围有问题...
2022-04-19 14:55:37
3297
原创 link[rel=“icon“]
设置站点信息setSiteInfo() { const url = window.location.host; siteApi(url).then((res) => { const resData = res || {}; this.siteInfo.siteLogo = resData.frontEndLogo; this.siteInfo.siteName = resData.frontEndName; this.siteInfo.siteDefaultN
2022-04-12 14:39:42
1217
原创 element input正则校验输入数字且小数点后只能输入2位
<el-input v-model="data.score" clearable οninput="value=value.replace(/[^1-9]{0,1}(\d*(?:\.\d{0,2})?).*$/g, '$1')" placeholder="请输入指标分值" size="small" />
2022-04-02 10:44:10
3184
1
原创 typescript 中 [propName: string]的使用
其他没有使用的属性名 可以统一使用[propName: string]: number | string | boolean | Array<string>;定义类型 属性值的类型是把所有的类型都展示interface DataState { id: number | string; createTime: number; commentUserAvatar: string; commentDeleted: boolean; commentUserNam
2022-01-17 17:58:00
2938
原创 router.push特殊形式
const test1 = () => { const num = '/expert/question?id=1473477689282564097&name=畜牧业&question=true'; const x = num.split(/[?]/); var arrPath = x.slice(0, 1); console.log('arrPath:', arrPath); var arrQuery = x.slice(1, x.l
2022-01-14 15:21:59
378
原创 取出富文本转义的文本
工具函数v-html 可以转义富文本格式的内容转义格式：（初始化）`<p style="line-height: 1.2;"><span style="font-family: simsun, serif; font-size: 12pt;"><img class="wscnph" style="display: block; margin-left: auto; margin-right: auto;" src="https://wx-pro-image.wanxue.
2021-12-15 18:37:55
1259
原创 vue3生命周期
生命周期图谱典型生命周期1 beforeCreate在实例初始化之后、进行数据侦听和事件/侦听器的配置之前同步调用。2 created在实例创建完成后被立即同步调用。在这一步中，实例已完成对选项的处理，意味着以下内容已被配置完毕：数据侦听、计算属性、方法、事件/侦听器的回调函数。然而，挂载阶段还没开始，且 $el property 目前尚不可用。3 beforeMount在挂载开始之前被调用：相关的 render 函数首次被调用。该钩子在服务器端渲染期间不被调用。
2021-12-07 18:15:58
1381
原创 vue3 ts setup父子组件传值
问题描述：使用<script lang="ts" setup>标签 获取ref总是找不到，起初我以为是传染子组件先后顺序问题 增加一个setTimeout 和nexttick，但是还是找不到ref。查看资料看到这种写法增加了三个语法糖（父子组件通信）使用defineEmit,defineProps,defineExpose这里我主要是想父组件 调用子组件的方法，所以使用defineEmit还有获取ref所以使用defineExpose父组件<template> <
2021-12-07 16:06:46
3150
原创 vue3 ts proptype
目的：类型补充属性校验使用：import { computed, PropType, onMounted } from 'vue';interface otherBread { title: string; path: string; }export default { components: {}, props: { otherBreadcrumb: { type: Array as PropType<otherBread[]>
2021-12-06 10:31:47
880
原创 vue3遇到问题整理（不定期更新）
1.is="vue:script"<div is="vue:script" src="https://p.bokecc.com/player?newversion=true" type="text/javascript" />2.Volar vscode中插件的安装使用3.reatvie，ref，unref，toRef/toRefs/isRefreatvie对应用类型数据进行包裹，使其称为响应式的数据，vue不建议使用原对象（应用类型数据），而直接使用包裹后的数据，因为
2021-11-24 15:46:47
1769
原创 vue3 update:modelValue使用
v-model中update:modelValuev-model的主要原因是由于value和input事件可能另有它用，那么我们可不可以直接使用另外的属性和方法，而不需要去通过model进行定义。vue3中就实现了这个功能，v-model绑定的不再是value，而是modelValue，接收的方法也不再是input，而是update:modelValue写法：<ChildComponent v-model:title="title" />//或者<ChildCompone
2021-11-22 17:18:04
44682
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人