【BUG】vue中@change时间传值丢失问题

项目场景:

在修改项目bug时,发现后端响应到前端的值,通过@change事件调用方法,在方法中拿到值时,有部分数据丢失。


问题描述

后端传到前端的值为:字符串类型的"00000089",@change调用的方法中,拿到这个值时,变为了89。

错误代码:

html 复制代码
<el-from-item prop="insured">
	<el-checkbox-group v-model="dto.insured">
		<% for(item in vo.insured) { %>
			<el-checkbox label="${item.name}" @change = "inChange(${item.no})"> </el-checkbox>
		<% } %>
	</el-checkbox-group >
</el-from-item> 


<script type="text/javascript">
	inChange : function(val){
		console.log("res:" , val);
	}
</script>

原因分析:

后端传到前端的值为:字符串类型的"00000089",但是传递@change事件中,元素类型发生了改变,变为数字类型,传递到方法中就变为了数字类型的89。


解决方案:

直接上代码:

html 复制代码
<el-from-item prop="insured">
	<el-checkbox-group v-model="dto.insured">
		<% for(item in vo.insured) { %>
			<el-checkbox label="${item.name}" name="${item.no}" @change = "inChange"> </el-checkbox>
		<% } %>
	</el-checkbox-group >
</el-from-item> 


<script type="text/javascript">
	inChange : function(val, e){
		console.log("res:" , e.target.name);
	}
</script>
相关推荐
小江的记录本2 分钟前
【HTTP】HTTP请求方法与状态码(全体系知识总结+附表格)
前端·网络·后端·网络协议·http·状态模式·web
卤蛋fg68 分钟前
vue表格vxe-table实现表头合并,分组表头自定义合并
vue.js
leafyyuki14 分钟前
前端 SSE 流式请求实战:打造流畅的 AI 流式应答体验
前端·人工智能·markdown
幸福指北22 分钟前
我用 Tauri + Vue 3 + Rust 开发了一款跨平台网络连接监控工具Portview,性能炸裂!
前端·网络·vue.js·tcp/ip·rust
炁场悟道23 分钟前
基于vue3的极简登录架构设计
前端
光影少年26 分钟前
Webpack的核心概念?常见优化手段?
前端·webpack·掘金·金石计划
han_27 分钟前
前端性能优化之白屏、卡顿指标和网络环境采集篇
前端·javascript·性能优化
Flyfreelylss36 分钟前
DOM 注入实践:在 React 中优雅地扩展第三方组件
前端·react.js
北城笑笑44 分钟前
Vue 100 ,Metaspace memory lack Error( 元空间内存不足 )
java·前端·javascript·vue
谏书稀1 小时前
vue项目(pnpm)迁移到无网环境开发
前端·javascript·vue.js