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

碰到一个逆天表中表数据渲染

1. 逆天表中表数据问题

  1. 我有一个antd-table组件,他的编辑可以打开一个编辑弹窗
  2. 打开弹窗里面还会有一个表格,如果这个表格的column是在外层js文件中保存的话,那么第一次打开会正常渲染数据,再次打开就不会渲染,即使是已经调用了接口
  3. 如果这个column定义在编辑弹窗中的表格组件中,那么永远会正常渲染数据

2. 发现只有定义 slot 之后再次打开才会显示

这里只是针对外部js

当表格编辑取消之后,没有定义slot的不显示,其实是有数据的,定义了slot的就会显示,就像这样
在外部js文件中每个定义slot之后再次打开会显示
这说明表格确实是有数据的,但是关闭原表编辑弹窗后再打开却只显示了一个slot的 imageUrl
不明白什么原因,先记录一下

// 这是表格的编辑弹窗内定义的p-table组件
<p-table:fetch="fetch ? fetch : []":columns="TABLE_COLUMN":bordered="true":filterMultiple="true"ref="pTable"
><template #imageUrl="{record}"><a-image style="width: 50px; height: 50px;" :src="record.imageUrl"></a-image></template>
</p-table>// 以下是外部js文件中导出的常量
export const TABLE_COLUMN = [{ title: "商品名称", dataIndex: "name", key: "name" },{ title: "商品Id", dataIndex: "goodsId", key: "goodsId" },{ title: "订单号", dataIndex: "orderItemsId", key: "orderItemsId"},{ title: "退款单号", dataIndex: "aftersalesId", key: "aftersalesId" },{ title: "商品图片", dataIndex: "imageUrl", key: "imageUrl", slots: { customRender: "imageUrl" }},{ title: "申请时间", dataIndex: "createTime", key: "createTime" },
];

而且数据获取了,打印出来一看是数据集合 [{xxx: 'xxx'}]
但是有的 dataIndex 就是不显示,即使是有数据的…’
下面的两个,是真的不会显示数据,即使定义了 slot ,其余的都显示了,就这两条数据没有显示,其实是有数据的
在这里插入图片描述

{ title: "订单号", dataIndex: "orderItemsId", key: "orderItemsId"},
{ title: "退款单号", dataIndex: "aftersalesId", key: "aftersalesId" }

相关文章:

碰到一个逆天表中表数据渲染

1. 逆天表中表数据问题 我有一个antd-table组件&#xff0c;他的编辑可以打开一个编辑弹窗打开弹窗里面还会有一个表格&#xff0c;如果这个表格的column是在外层js文件中保存的话&#xff0c;那么第一次打开会正常渲染数据&#xff0c;再次打开就不会渲染&#xff0c;即使是已…...

记录我常用的免费API接口

目录 1.随机中英文句子 2.随机中英文句子&#xff08;带图片和音频&#xff09; 3.随机一句诗 4.随机一句话 5.随机一句情话 6. 随机一句舔狗语录 7.历史上的今天 8.获取来访者ip地址 9&#xff1a;获取手机号信息 10. 垃圾分类查询 11.字典查询 12.QQ信息查询 1.随…...

编程的简单实例,编程零基础入门教程,中文编程开发语言工具下载

编程的简单实例&#xff0c;编程零基础入门教程&#xff0c;中文编程开发语言工具下载 给大家分享一款中文编程工具&#xff0c;零基础轻松学编程&#xff0c;不需英语基础&#xff0c;编程工具可下载。 这款工具不但可以连接部分硬件&#xff0c;而且可以开发大型的软件&…...

创芯科技USB_CAN【库文件】

只用到【只收】【只发】功能 23.11.18 using help; //using Models; using System; using System.Collections.Generic; using System.Linq; using System.Net.NetworkInformation; using System.Runtime.CompilerServices; using System.Runtime.InteropServices; using Sys…...

React整理总结(四)

1.过渡动画react-transition-group Transition 与平台无关&#xff0c;不一定使用css实现CSSTransition组件&#xff0c;in属性控制展示隐藏&#xff0c;添加className&#xff1b;有三个状态appear | enter | exit 第一类&#xff0c;开始状态&#xff1a;对于的类是-appear、…...

ajax,axios,fetch

文章目录 ajax工作原理ajax发请求四个步骤创建xmlhttprequest对象设置请求方式设置回调函数发送请求 自封装ajax axiosaxios 特性如何用配置拦截器fetch 三者区别 ajax 工作原理 Ajax的工作原理相当于在用户和服务器之间加了—个中间层(AJAX引擎)&#xff0c;使用户操作与服务…...

Java值传递和引用传递

在Java中&#xff0c;有值传递&#xff08;Pass-by-Value&#xff09;和引用传递&#xff08;Pass-by-Reference&#xff09;两种参数传递方式。 值传递&#xff08;Pass-by-Value&#xff09;&#xff1a;当使用值传递方式时&#xff0c;方法将参数的副本传递给调用方法。这意…...

FPGA_IIC代码-正点原子 野火 小梅哥 特权同学对比写法(1)

FPGA_IIC代码-正点原子 野火 小梅哥 特权同学对比写法&#xff08;1&#xff09; 单字节写时序单字节读时序I2C 控制器设计模块框图scl_high 和 scl_low 产生的时序图状态转移图 Verilog代码 FPGA_IIC代码-正点原子 野火 小梅哥 特权同学对比写法&#xff08;1&#xff09; FPG…...

LabVIEW编程开发NI-USRP

LabVIEW编程开发NI-USRP 可编程性是SDR的关键特性&#xff0c;它使人们能够将无线电外围设备转换为先进的无线系统。USRP是市场上最开放、最通用的SDR&#xff0c;可帮助工程师在主机和FPGA上使用各种软件开发工具构建系统。 有多种选项可用于对基于SDR的系统的主机进行编程。…...

ES6中实现继承

本篇文章主要说明在ES6中如何实现继承&#xff0c;学过java的小伙伴&#xff0c;对class这个关键字应该不陌生&#xff0c;ES6中也提供了class这个关键字作为实现类的语法糖&#xff0c;咱们一起实现下ES6中的继承。 实现思路 首先直接通过class来声明一个Teacther类&#xff…...

车载通信架构 —— 新车载总线类型下(以太网)的通信架构

我是穿拖鞋的汉子&#xff0c;魔都中坚持长期主义的汽车电子工程师。 老规矩&#xff0c;分享一段喜欢的文字&#xff0c;避免自己成为高知识低文化的工程师&#xff1a; 屏蔽力是信息过载时代一个人的特殊竞争力&#xff0c;任何消耗你的人和事&#xff0c;多看一眼都是你的不…...

ArkTS - HarmonyOS服务卡片(创建)

可以参考官网文档 其中我们在已有的文件中File > New > Service Widget创建你想要的小卡片 本文章发布时目前可使用的模板就三种 有卡片后的new 最终效果...

Zotero在word中插入带超链接的参考文献/交叉引用/跳转参考文献

Zotero以其丰富的插件而闻名&#xff0c;使用起来十分的带劲&#xff0c;最重要的是它是免费的、不卡顿&#xff0c;不像某专业软件。 然而Zotero在word插入参考文献时&#xff0c;无法为参考文献添加超链接&#xff0c;这是一个不得不提的遗憾。 不过&#xff0c;有大佬已经…...

持续集成部署-k8s-配置与存储-配置管理:ConfigMap 的热更新

ConfigMap 的热更新 1. 简介2. 新建 Pod3. 使用 edit 命令编辑修改4. 使用 replace 命令替换修改1. 简介 在 Kubernetes 中,ConfigMap 是用于存储非敏感配置数据的 API 对象,它可以被挂载到 Pod 中作为文件或环境变量。ConfigMap 的热更新指的是在不重启 Pod 的情况下,动态…...

Python文本段落翻译

Python文本段落翻译 1、Translate库2、基本使用 1、Translate库 translate非标准库是Python中可以实现对多种语言进行互相翻译的库&#xff0c;translate可以将原始文本或段落翻译成我们需要的目标语言 translate支持多种语言&#xff0c;常见的例如&#xff1a; zh/zh-CN&…...

Flink(七)【输出算子(Sink)】

前言 今天是我写博客的第 200 篇&#xff0c;恍惚间两年过去了&#xff0c;现在已经是大三的学长了。仍然记得两年前第一次写博客的时候&#xff0c;当时学的应该是 Java 语言&#xff0c;菜的一批&#xff0c;写了就删&#xff0c;怕被人看到丢脸。当时就想着自己一年之后&…...

【自我管理】To-do list已过时?学写Done List培养事业成功感

自我管理&#xff1a;已完成清单&#xff08;doneList&#xff09;培养事业成功感 待办事项清单常常让人感到压力山大&#xff0c;让人不想面对工作。但是&#xff0c;你知道吗&#xff1f;除了待办清单之外&#xff0c;还有一个叫做「已完成清单」的东西&#xff0c;它可能更符…...

优思学院|什么是精益生产管理?从一个生活上的故事出发来说明。

你关掉电脑&#xff0c;离开办公室。 一个小时后&#xff0c;你进入家门和孩子们在一起。 你和家人一起吃晚饭。 你的老板打电话来查看你的项目进展。 你哄孩子入睡并给他们读个故事。 作为一个负责任的父母&#xff0c;你想要与孩子们的互动时间增加并提高生活的质量&…...

Swagger-----knife4j框架

简介 使得前后端分离开发更加方便&#xff0c;有利于团队协作 接口的文档在线自动生成&#xff0c;降低后端开发人员编写接口文档的负担 功能测试 Spring已经将Swagger纳入自身的标准&#xff0c;建立了Spring-swagger项目&#xff0c;现在叫Springfox。通过在项目中引入Spri…...

企业数字化过程中数据仓库与商业智能的目标

当前环境下&#xff0c;各领域企业通过数字化相关的一切技术&#xff0c;以数据为基础、以用户为核心&#xff0c;创建一种新的&#xff0c;或对现有商业模式进行重塑就是数字化转型。这种数字化转型给企业带来的效果就像是一次重构&#xff0c;会对企业的业务流程、思维文化、…...

利用最小二乘法找圆心和半径

#include <iostream> #include <vector> #include <cmath> #include <Eigen/Dense> // 需安装Eigen库用于矩阵运算 // 定义点结构 struct Point { double x, y; Point(double x_, double y_) : x(x_), y(y_) {} }; // 最小二乘法求圆心和半径 …...

CTF show Web 红包题第六弹

提示 1.不是SQL注入 2.需要找关键源码 思路 进入页面发现是一个登录框&#xff0c;很难让人不联想到SQL注入&#xff0c;但提示都说了不是SQL注入&#xff0c;所以就不往这方面想了 ​ 先查看一下网页源码&#xff0c;发现一段JavaScript代码&#xff0c;有一个关键类ctfs…...

突破不可导策略的训练难题:零阶优化与强化学习的深度嵌合

强化学习&#xff08;Reinforcement Learning, RL&#xff09;是工业领域智能控制的重要方法。它的基本原理是将最优控制问题建模为马尔可夫决策过程&#xff0c;然后使用强化学习的Actor-Critic机制&#xff08;中文译作“知行互动”机制&#xff09;&#xff0c;逐步迭代求解…...

遍历 Map 类型集合的方法汇总

1 方法一 先用方法 keySet() 获取集合中的所有键。再通过 gey(key) 方法用对应键获取值 import java.util.HashMap; import java.util.Set;public class Test {public static void main(String[] args) {HashMap hashMap new HashMap();hashMap.put("语文",99);has…...

Day131 | 灵神 | 回溯算法 | 子集型 子集

Day131 | 灵神 | 回溯算法 | 子集型 子集 78.子集 78. 子集 - 力扣&#xff08;LeetCode&#xff09; 思路&#xff1a; 笔者写过很多次这道题了&#xff0c;不想写题解了&#xff0c;大家看灵神讲解吧 回溯算法套路①子集型回溯【基础算法精讲 14】_哔哩哔哩_bilibili 完…...

[ICLR 2022]How Much Can CLIP Benefit Vision-and-Language Tasks?

论文网址&#xff1a;pdf 英文是纯手打的&#xff01;论文原文的summarizing and paraphrasing。可能会出现难以避免的拼写错误和语法错误&#xff0c;若有发现欢迎评论指正&#xff01;文章偏向于笔记&#xff0c;谨慎食用 目录 1. 心得 2. 论文逐段精读 2.1. Abstract 2…...

在四层代理中还原真实客户端ngx_stream_realip_module

一、模块原理与价值 PROXY Protocol 回溯 第三方负载均衡&#xff08;如 HAProxy、AWS NLB、阿里 SLB&#xff09;发起上游连接时&#xff0c;将真实客户端 IP/Port 写入 PROXY Protocol v1/v2 头。Stream 层接收到头部后&#xff0c;ngx_stream_realip_module 从中提取原始信息…...

C++ 基础特性深度解析

目录 引言 一、命名空间&#xff08;namespace&#xff09; C 中的命名空间​ 与 C 语言的对比​ 二、缺省参数​ C 中的缺省参数​ 与 C 语言的对比​ 三、引用&#xff08;reference&#xff09;​ C 中的引用​ 与 C 语言的对比​ 四、inline&#xff08;内联函数…...

从零开始打造 OpenSTLinux 6.6 Yocto 系统(基于STM32CubeMX)(九)

设备树移植 和uboot设备树修改的内容同步到kernel将设备树stm32mp157d-stm32mp157daa1-mx.dts复制到内核源码目录下 源码修改及编译 修改arch/arm/boot/dts/st/Makefile&#xff0c;新增设备树编译 stm32mp157f-ev1-m4-examples.dtb \stm32mp157d-stm32mp157daa1-mx.dtb修改…...

LLM基础1_语言模型如何处理文本

基于GitHub项目&#xff1a;https://github.com/datawhalechina/llms-from-scratch-cn 工具介绍 tiktoken&#xff1a;OpenAI开发的专业"分词器" torch&#xff1a;Facebook开发的强力计算引擎&#xff0c;相当于超级计算器 理解词嵌入&#xff1a;给词语画"…...