当前位置: 首页 > 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" }
http://www.lryc.cn/news/237094.html

相关文章:

  • 记录我常用的免费API接口
  • 编程的简单实例,编程零基础入门教程,中文编程开发语言工具下载
  • 创芯科技USB_CAN【库文件】
  • React整理总结(四)
  • ajax,axios,fetch
  • Java值传递和引用传递
  • FPGA_IIC代码-正点原子 野火 小梅哥 特权同学对比写法(1)
  • LabVIEW编程开发NI-USRP
  • ES6中实现继承
  • 车载通信架构 —— 新车载总线类型下(以太网)的通信架构
  • ArkTS - HarmonyOS服务卡片(创建)
  • Zotero在word中插入带超链接的参考文献/交叉引用/跳转参考文献
  • 持续集成部署-k8s-配置与存储-配置管理:ConfigMap 的热更新
  • Python文本段落翻译
  • Flink(七)【输出算子(Sink)】
  • 【自我管理】To-do list已过时?学写Done List培养事业成功感
  • 优思学院|什么是精益生产管理?从一个生活上的故事出发来说明。
  • Swagger-----knife4j框架
  • 企业数字化过程中数据仓库与商业智能的目标
  • 从零开始写一个APM监控程序(一)协议
  • UDP网络套接字编程
  • 【苏州元德维康生物医药-注册】
  • 从零带你底层实现unordered_map (1)
  • 第六届浙江省大学生网络与信息安全竞赛 2023年 初赛/决赛 WEB方向 Writeup
  • 设计模式篇---装饰模式
  • JAXB:根据Java文件生成XML schema文件
  • opencv(5): 滤波器
  • 《微信小程序开发从入门到实战》学习二十二
  • LLM模型-讯飞星火与百度文心api调用
  • AIGC ChatGPT 4 将数据接口文件使用Python进行入库Mysql