vue3完整Demo(数据绑定,数据显示,数据修改,数据提交)

需要引入的的依赖:jquery(用于异步请求)

一、数据显示的前端页面

条件查询数据并显示,下拉框使用的model双向绑定

二、js代码(list页面的数据请求)

后端传来的时间数据需要转换可以使用new Intl.DateTimeFormat('zh-CN', options);转换一下

三、添加数据前端页面

input标签使用model属性进行绑定,提交时才可以把数据给后端进行处理

四、添加数据js代码

需要注意的是:

如果和我一样使用的组合式API风格就需要再调用变量时加上.value ,不然无法调用值

页面展示

添加页面

数据添加

成功的数据显示

相关推荐
biyezuopinvip17 小时前
基于Spring Boot的企业网盘的设计与实现(任务书)
java·spring boot·后端·vue·ssm·任务书·企业网盘的设计与实现
biyezuopinvip1 天前
基于Spring Boot的企业网盘的设计与实现(毕业论文)
java·spring boot·vue·毕业设计·论文·毕业论文·企业网盘的设计与实现
Cult Of3 天前
Alicea Wind的个人网站开发日志(2)
开发语言·python·vue
Byron07074 天前
从多端割裂到体验统一:基于 Vue 生态的跨端架构落地实战
vue·多端
计算机程序设计小李同学4 天前
基于 Spring Boot + Vue 的龙虾专营店管理系统的设计与实现
java·spring boot·后端·spring·vue
沐墨染4 天前
Vue实战:自动化研判报告组件的设计与实现
前端·javascript·信息可视化·数据分析·自动化·vue
奔跑的呱呱牛4 天前
viewer-utils 图片预览工具库
javascript·vue·react
Cult Of4 天前
Alicea Wind的个人网站开发日志(1)
python·vue
Polaris_YJH4 天前
使用Vue3+Vite+Pinia+elementUI搭建初级企业级项目
前端·javascript·elementui·vue
Mr Xu_4 天前
【Vue3 + ECharts 实战】正确使用 showLoading、resize 与 dispose 避免内存泄漏
前端·信息可视化·vue·echarts