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

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

一、数据显示的前端页面

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

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

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

三、添加数据前端页面

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

四、添加数据js代码

需要注意的是:

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

页面展示

添加页面

数据添加

成功的数据显示

相关推荐
小强库计算机毕业设计2 天前
SpringBoot+Vue3 学生宿舍管理系统实战
java·spring boot·后端·vue·学生宿舍管理系统
TELL5215 天前
vue前端架构
vue
南城以南溫暖如初1475 天前
社区健身小程序开发流程详解:技术选型与实施经验分享
java·经验分享·spring boot·mysql·vue·apache
万亿少女的梦1685 天前
基于Spring Boot、Vue与MySQL的私人健身教练预约管理系统设计
java·spring boot·mysql·vue·预约管理
满栀5856 天前
vue动态路由效果
前端·javascript·vue.js·前端框架·vue
碧水澜庭7 天前
头条【vue+fastapi 】全栈教学项目系列之《02_双系统零基础环境搭建手册》
vue·fastapi
DsirNg9 天前
从 `@wheel.prevent.stop` 到事件捕获:一次讲清浏览器事件流与 Vue 事件修饰符
javascript·vue·事件修饰符·事件冒泡·dom 事件·事件捕获·wheel
其美杰布-富贵-李9 天前
Vue 3 模板语法速通:彻底理解 `:`、`@`、`#`、`v-if`、`v-for` 与 `v-model`
vue
DsirNg9 天前
基于拓扑排序的画布自动布局:用最长上游路径决定节点列级
vue·流程图·拓扑排序·状态管理·有向图·自动布局·最长路径
way_hj11 天前
Flask笔记(2)快速web项目
笔记·flask·vue·web