用户列表新增&编辑接口调用

宁渡课堂 2023-01-13 03:33:03

课时名称	课时知识点
用户列表新增&编辑接口调用	用户列表新增&编辑接口调用

...全文

153 回复打赏收藏转发到动态举报

写回复

回复

切换为时间正序

请发表友善的回复…

发表回复

当我们编辑和新增用同一个弹框的时候，新增接口和编辑接口都是点击确定按钮这个时候我们往往需要有一个判断条件去区分到底调用哪一个接口这个条件就是通过vue调试工具，我们看看编辑的时候回显的数据和新增的数据的不同（往往是新增无id，编辑会回显，有id）可以看出新增无id，编辑有id 如果是父子组件的，还要注意一个bug，因为我们回显的接口参数是父组件传来的值，，并且把这个返回值给了自己声明的这个data变量，那么在我们点击编辑的时候，我们一直得到的都是回显的这个数据，一直都会有id，那么我们就进不去新增

一般，我们写好界面之后用axios发送post请求拿数据，浏览器只能发送get axios.post(url).then(data=>console.log(data)) 在页面上进行调用接下来简单粗暴说一下怎么实现新增和修改功能按理说新增和修改应该是同样的弹窗只是新增没数据，修改有数据在新增的按钮里面写一个add方法当调用的时候，把它设置为true(显示) 同时把id...

实现目标：点击新增和编辑按钮时出现同一个弹窗，但展示信息不同，分别对接新增和编辑接口。直观效果：前端页面中的新增和编辑按钮点击新增按钮出现的弹框：点击编辑出现的弹框：新增和编辑均是通过确定按钮来对接接口。后端swagger： api下的js文件： // 新增 export function insertMaterial(param) { return request({ url: '/xxxx/xxxxx/insert', .

P19-Vue3后台管理系统-用户管理界面-新增用户和查询用户 1.概述这篇文章介绍新增用户和查询用户功能开发 2.新增用户 2.1.新增用户实现逻辑 1.点击新建按钮绑定新增用户方法 2.新增用户方法中调用form弹框控件 3.在form弹框控件中调用confirm方法，该方法调用新增用户接口。 2.2.新增用户效果 3.根据姓名搜索用户 3.1.搜索用户逻辑点击搜索后，将搜索用户名称作为查询条件传给查询用户数据接口，该接口返回符合条件的数据 3.2.搜索用户效果 4.新增用户

目标：点击增加按钮出现弹窗，弹窗中多选框的名称是通过其他接口获取的；点击编辑按钮出现弹窗，且该行的数据已被传递到该弹窗中，增加和编辑接口均是点击弹窗中的确定按钮进行调用的。 1.api的js接口文件中： // 编辑 export function rulesUpdate(param) { return request({ url: "/xxx/xxxx/update", method: "post", headers: {

jason的课程社区_NO_1

1

社区成员

140

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章