当前位置: 首页 > 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;会对企业的业务流程、思维文化、…...

使用VSCode开发Django指南

使用VSCode开发Django指南 一、概述 Django 是一个高级 Python 框架&#xff0c;专为快速、安全和可扩展的 Web 开发而设计。Django 包含对 URL 路由、页面模板和数据处理的丰富支持。 本文将创建一个简单的 Django 应用&#xff0c;其中包含三个使用通用基本模板的页面。在此…...

React第五十七节 Router中RouterProvider使用详解及注意事项

前言 在 React Router v6.4 中&#xff0c;RouterProvider 是一个核心组件&#xff0c;用于提供基于数据路由&#xff08;data routers&#xff09;的新型路由方案。 它替代了传统的 <BrowserRouter>&#xff0c;支持更强大的数据加载和操作功能&#xff08;如 loader 和…...

Vue3 + Element Plus + TypeScript中el-transfer穿梭框组件使用详解及示例

使用详解 Element Plus 的 el-transfer 组件是一个强大的穿梭框组件&#xff0c;常用于在两个集合之间进行数据转移&#xff0c;如权限分配、数据选择等场景。下面我将详细介绍其用法并提供一个完整示例。 核心特性与用法 基本属性 v-model&#xff1a;绑定右侧列表的值&…...

什么是库存周转?如何用进销存系统提高库存周转率?

你可能听说过这样一句话&#xff1a; “利润不是赚出来的&#xff0c;是管出来的。” 尤其是在制造业、批发零售、电商这类“货堆成山”的行业&#xff0c;很多企业看着销售不错&#xff0c;账上却没钱、利润也不见了&#xff0c;一翻库存才发现&#xff1a; 一堆卖不动的旧货…...

ffmpeg(四):滤镜命令

FFmpeg 的滤镜命令是用于音视频处理中的强大工具&#xff0c;可以完成剪裁、缩放、加水印、调色、合成、旋转、模糊、叠加字幕等复杂的操作。其核心语法格式一般如下&#xff1a; ffmpeg -i input.mp4 -vf "滤镜参数" output.mp4或者带音频滤镜&#xff1a; ffmpeg…...

【RockeMQ】第2节|RocketMQ快速实战以及核⼼概念详解(二)

升级Dledger高可用集群 一、主从架构的不足与Dledger的定位 主从架构缺陷 数据备份依赖Slave节点&#xff0c;但无自动故障转移能力&#xff0c;Master宕机后需人工切换&#xff0c;期间消息可能无法读取。Slave仅存储数据&#xff0c;无法主动升级为Master响应请求&#xff…...

USB Over IP专用硬件的5个特点

USB over IP技术通过将USB协议数据封装在标准TCP/IP网络数据包中&#xff0c;从根本上改变了USB连接。这允许客户端通过局域网或广域网远程访问和控制物理连接到服务器的USB设备&#xff08;如专用硬件设备&#xff09;&#xff0c;从而消除了直接物理连接的需要。USB over IP的…...

BLEU评分:机器翻译质量评估的黄金标准

BLEU评分&#xff1a;机器翻译质量评估的黄金标准 1. 引言 在自然语言处理(NLP)领域&#xff0c;衡量一个机器翻译模型的性能至关重要。BLEU (Bilingual Evaluation Understudy) 作为一种自动化评估指标&#xff0c;自2002年由IBM的Kishore Papineni等人提出以来&#xff0c;…...

【Post-process】【VBA】ETABS VBA FrameObj.GetNameList and write to EXCEL

ETABS API实战:导出框架元素数据到Excel 在结构工程师的日常工作中,经常需要从ETABS模型中提取框架元素信息进行后续分析。手动复制粘贴不仅耗时,还容易出错。今天我们来用简单的VBA代码实现自动化导出。 🎯 我们要实现什么? 一键点击,就能将ETABS中所有框架元素的基…...

恶补电源:1.电桥

一、元器件的选择 搜索并选择电桥&#xff0c;再multisim中选择FWB&#xff0c;就有各种型号的电桥: 电桥是用来干嘛的呢&#xff1f; 它是一个由四个二极管搭成的“桥梁”形状的电路&#xff0c;用来把交流电&#xff08;AC&#xff09;变成直流电&#xff08;DC&#xff09;。…...