当前位置: 首页 > news >正文

更新页面无法回显

需求与问题:

在菜品管理开发中,我需要修改菜品,第一步是回显页面,但在我再三确认代码无误的情况下依旧无法回显内容

问题发现与解决:

经过排查,我发现我的DishDTO内容如下:

@Data
public class DishDTO extends Dish {private List<DishFlavor> dishFlavors=new ArrayList<>();private String categoryName;
}

传输内容如下:

前端接收如下:

                this.dishFlavors = res.data.flavors&& res.data.flavors.map(obj => ({ ...obj, value: JSON.parse(obj.value),showOption: false }))

通过对比,我们可以发现是前端接收后端传递过来的数据的时候用的名字不对,res.data传递过来的数据只有dishFlavors而没有flavors,所以口味列表无法接收,导致整个页面无法回显

问题解决

将前端的flavors改为dishFlavors,保持和后端传递过来的数据名严格一致即可解决!

                this.dishFlavors = res.data.dishFlavors && res.data.dishFlavors.map(obj => ({ ...obj, value: JSON.parse(obj.value),showOption: false }))


大家在开发中一定要记住前后端交互变量名保持一致呀,不然就会像我一样找好几个小时的bug

o(╥﹏╥)o

 

相关文章:

更新页面无法回显

需求与问题&#xff1a; 在菜品管理开发中&#xff0c;我需要修改菜品&#xff0c;第一步是回显页面&#xff0c;但在我再三确认代码无误的情况下依旧无法回显内容 问题发现与解决&#xff1a; 经过排查&#xff0c;我发现我的DishDTO内容如下&#xff1a; Data public clas…...

CS 144 Lab Four -- the TCP connection

CS 144 Lab Four -- the TCP connection TCPConnection 简述TCP 状态图代码实现完整流程追踪 测试 对应课程视频: 【计算机网络】 斯坦福大学CS144课程 Lab Three 对应的PDF: Lab Checkpoint 4: down the stack (the network interface) TCPConnection 简述 TCPConnection 需…...

在Volo.Abp微服务中使用SignalR

假设需要通过SignalR发送消息通知&#xff0c;并在前端接收消息通知的功能 创建SignalR服务 在项目中引用 abp add-package Volo.Abp.AspNetCore.SignalR在Module文件中添加对模块依赖 [DependsOn(...typeof(AbpAspNetCoreSignalRModule))] public class IdentityApplicati…...

数据可视化(七)常用图表的绘制

1. #seaborn绘制常用图表 #折线图 #replot&#xff08;x&#xff0c;y&#xff0c;kind&#xff0c;data&#xff09; #lineplot&#xff08;x&#xff0c;y&#xff0c;data&#xff09; #直方图 #displot&#xff08;data&#xff0c;rug&#xff09; #条形图 #barplot&…...

【ARM 常见汇编指令学习 8 - dsb sy 指令及 dsb 参数介绍】

文章目录 ARM dsb sy 指令 上篇文章&#xff1a;ARM 常见汇编指令学习 7 - LDR 指令与LDR伪指令及 mov指令 下篇文章&#xff1a;ARM 常见汇编指令学习 9 - 缓存管理指令 DC 与 IC ARM dsb sy 指令 数据同步屏障是一种特殊类型的内存屏障。 只有当DSB指令执行完毕后&#xff…...

YOLOv5本地模型训练报错解决

报错解决 页面文件太小&#xff0c;无法完成操作 训练过程中&#xff0c;发生下图所示的报错&#xff0c;同时pycharm崩溃 1. 更改虚拟内存 进入高级系统设置&#xff0c;应该都会进&#xff0c;就不说过程了 设置虚拟内存大小 2. 减小占用内容大小 新建一个fixNvPe.py程序…...

tomcat p12证书另存为nginx .crt证书和.key私钥

tomcat p12证书另存为nginx .crt证书和.key私钥 Tomcat使用的.pfx或.keystore文件都是私钥及公钥证书一起的&#xff0c;通过pin保证安全&#xff1b;nginx只需要使用.pem或.crt公钥证书文件和.key私钥即可&#xff0c;如果原ssl证书不方便重新下载&#xff0c;在已有tomcat证…...

Docker的userland-proxy

前言 Docker针对端口映射前后有两种方案&#xff0c;一种是1.7版本之前docker-proxyiptables DNAT 的方式&#xff1b;另一种则是1.7版本(及之后)提供的完全由iptables DNAT实现的端口映射。不过在目前docker 1.9.1中&#xff0c;前一种方式依旧是默认方式。但是从Docker 1.7版…...

uniapp封装request请求

在基础文件里面创建一个api文件 在创建两个 js文件 http.js 里面封装 request 请求 let baseUrl https://white.51.toponet.cn; //基地址 export const request (options {}) > {//异步封装接口&#xff0c;使用Promise处理异步请求return new Promise((resolve, reject…...

Go如何构建高效API接口| 青训营

Go语言作为一个高效的静态类型语言&#xff0c;在构建API服务时也表现出了很大的优势。本文将介绍如何使用Go语言构建高效的API服务&#xff0c;帮助开发者更好地应对日益增长的API需求。 一、选择适合的框架 首先&#xff0c;选择适合的框架是构建高效API服务的重要一步。在…...

【云原生K8s】二进制部署单master K8s+etcd集群

一、实验设计 mater节点master01192.168.190.10kube-apiserver kube-controller-manager kube-scheduler etcd node节点node01192.168.190.20kubelet kube-proxy docker (容…...

TRUNC(截取)函数的用法

TRUNC函数在Oracle中用于截断日期、时间或数字的精度。其语法如下&#xff1a; 截取数字&#xff1a; TRUNC(number [, precision])其中&#xff1a; number 表示要截断的数字。 precision表示截断的精度。可以是负数、整数或者默认为空。正数表示保留小数位数&#xff0c;负…...

IELAB-网络工程师的路由答疑10问(1)

各位同学&#xff0c;我相信对于许多新学习的同学而言&#xff0c;在刚接触该的时候总会产生许多问题&#xff0c;今天 我们就简单讲解一下常见的几种问题&#xff1a; 什么是路由&#xff1f; 简单来讲&#xff0c;路由通常发生在网络层&#xff0c;为什么呢&#xff1f;首先…...

OpenLayers入门,OpenLayers加载TopoJson数据,使用行政区划边界作为示例

专栏目录: OpenLayers入门教程汇总目录 前言 本章讲解一下OpenLayers如何加载解析TopoJson格式的数据。 TopoJson介绍 TopoJson是用于表示地理空间数据的格式。是GeoJson格式的改进版,相比 GeoJSON 直接使用 Polygon、Point 之类的几何体来表示图形的方法,TopoJSON 中的…...

【图像去噪】基于原始对偶算法优化的TV-L1模型进行图像去噪研究(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…...

RISC-V基础之函数调用(五)函数递归调用及函数参数数量溢出(超出现有寄存器个数)约定(包含实例)

首先先解释一下栈在函数调用中的作用&#xff0c;更详细的部分请参照考研复习之数据结构笔记&#xff08;五&#xff09;栈和队列&#xff08;上&#xff09;&#xff08;包含栈的相关内容&#xff09;_管二狗赶快去工作&#xff01;的博客-CSDN博客 函数嵌套调用栈的作用是用…...

力扣:48. 旋转图像(Python3)

题目&#xff1a; 给定一个 n n 的二维矩阵 matrix 表示一个图像。请你将图像顺时针旋转 90 度。 你必须在 原地 旋转图像&#xff0c;这意味着你需要直接修改输入的二维矩阵。请不要 使用另一个矩阵来旋转图像。 来源&#xff1a;力扣&#xff08;LeetCode&#xff09; 链接&…...

HarmonyOS应用开发者基础与高级认证题库——中级篇

系列文章目录 HarmonyOS应用开发者基础与高级认证题库——基础篇 HarmonyOS应用开发者基础与高级认证题库——中级篇 文章目录 系列文章目录前言一、判断二、单选三、多选 前言 今天刚换了台果子手机就收到了华子鸿蒙开发认证邀请&#xff08;认证链接&#xff09;&#xff0…...

Python中实现多个列表、字典、元组、集合的连接

目录 目录 前言 一、列表 1、运算符 2、extend&#xff08;&#xff09;方法 3、解包操作 * 二、字典 1、update&#xff08;&#xff09;方法 2、解包操作 ** 三、元组 1、 运算符 2、解包操作 * 四、集合 1、union方法 2、| 运算符 3、解包操作 * 五、不同类…...

1005 继续(3n+1)猜想

描述 卡拉兹(Callatz)猜想已经在1001中给出了描述。在这个题目里&#xff0c;情况稍微有些复杂。 当我们验证卡拉兹猜想的时候&#xff0c;为了避免重复计算&#xff0c;可以记录下递推过程中遇到的每一个数。例如对 n3 进行验证的时候&#xff0c;我们需要计算 3、5、8、4、…...

智慧工地云平台源码,基于微服务架构+Java+Spring Cloud +UniApp +MySql

智慧工地管理云平台系统&#xff0c;智慧工地全套源码&#xff0c;java版智慧工地源码&#xff0c;支持PC端、大屏端、移动端。 智慧工地聚焦建筑行业的市场需求&#xff0c;提供“平台网络终端”的整体解决方案&#xff0c;提供劳务管理、视频管理、智能监测、绿色施工、安全管…...

ESP32读取DHT11温湿度数据

芯片&#xff1a;ESP32 环境&#xff1a;Arduino 一、安装DHT11传感器库 红框的库&#xff0c;别安装错了 二、代码 注意&#xff0c;DATA口要连接在D15上 #include "DHT.h" // 包含DHT库#define DHTPIN 15 // 定义DHT11数据引脚连接到ESP32的GPIO15 #define D…...

SpringTask-03.入门案例

一.入门案例 启动类&#xff1a; package com.sky;import lombok.extern.slf4j.Slf4j; import org.springframework.boot.SpringApplication; import org.springframework.boot.autoconfigure.SpringBootApplication; import org.springframework.cache.annotation.EnableCach…...

云原生玩法三问:构建自定义开发环境

云原生玩法三问&#xff1a;构建自定义开发环境 引言 临时运维一个古董项目&#xff0c;无文档&#xff0c;无环境&#xff0c;无交接人&#xff0c;俗称三无。 运行设备的环境老&#xff0c;本地环境版本高&#xff0c;ssh不过去。正好最近对 腾讯出品的云原生 cnb 感兴趣&…...

【从零学习JVM|第三篇】类的生命周期(高频面试题)

前言&#xff1a; 在Java编程中&#xff0c;类的生命周期是指类从被加载到内存中开始&#xff0c;到被卸载出内存为止的整个过程。了解类的生命周期对于理解Java程序的运行机制以及性能优化非常重要。本文会深入探寻类的生命周期&#xff0c;让读者对此有深刻印象。 目录 ​…...

【 java 虚拟机知识 第一篇 】

目录 1.内存模型 1.1.JVM内存模型的介绍 1.2.堆和栈的区别 1.3.栈的存储细节 1.4.堆的部分 1.5.程序计数器的作用 1.6.方法区的内容 1.7.字符串池 1.8.引用类型 1.9.内存泄漏与内存溢出 1.10.会出现内存溢出的结构 1.内存模型 1.1.JVM内存模型的介绍 内存模型主要分…...

Linux基础开发工具——vim工具

文章目录 vim工具什么是vimvim的多模式和使用vim的基础模式vim的三种基础模式三种模式的初步了解 常用模式的详细讲解插入模式命令模式模式转化光标的移动文本的编辑 底行模式替换模式视图模式总结 使用vim的小技巧vim的配置(了解) vim工具 本文章仍然是继续讲解Linux系统下的…...

CTF show 数学不及格

拿到题目先查一下壳&#xff0c;看一下信息 发现是一个ELF文件&#xff0c;64位的 ​ 用IDA Pro 64 打开这个文件 ​ 然后点击F5进行伪代码转换 可以看到有五个if判断&#xff0c;第一个argc ! 5这个判断并没有起太大作用&#xff0c;主要是下面四个if判断 ​ 根据题目…...

Springboot 高校报修与互助平台小程序

一、前言 随着我国经济迅速发展&#xff0c;人们对手机的需求越来越大&#xff0c;各种手机软件也都在被广泛应用&#xff0c;但是对于手机进行数据信息管理&#xff0c;对于手机的各种软件也是备受用户的喜爱&#xff0c;高校报修与互助平台小程序被用户普遍使用&#xff0c;为…...

Axure Rp 11 安装、汉化、授权

Axure Rp 11 安装、汉化、授权 1、前言2、汉化2.1、汉化文件下载2.2、windows汉化流程2.3、 macOs汉化流程 3、授权 1、前言 Axure Rp 11官方下载链接&#xff1a;https://www.axure.com/downloadthanks 2、汉化 2.1、汉化文件下载 链接: https://pan.baidu.com/s/18Clf…...