Vben Admin使用BasicTable启用searchForm时日期组件默认值获取到的格式不对

原创已于 2023-05-08 13:46:39 修改 · 1k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #前端 #Vben Admin

于 2023-05-08 13:43:46 首次发布

文章讨论了在表单配置中遇到的日期格式问题，当用户未选择年度而直接查询时，获取的参数包含具体日期而非所需年度。为解决此问题，提出了在formConfig中添加transformDateFunc方法来转换时间格式，确保获取的是正确的年度信息。

表单配置的schemas日期格式为获取年度

初始化表格

不选择年度，直接点击查询按钮获取到的参数为{ "dataTime": "2023-01-01 00:00:00", "fluidType": "0"}，明显与我们需要的年度2023不一致。

解决办法：在formConfig中添加时间转化方法transformDateFunc，把时间转化为我们需要的格式即可。

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

可乐M

关注关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

二、Vben框架自定义BasicTable的form组件

张先森的博客

08-18

6331

Vben框架自定义BasicTable的form组件

vben-admin BasicTable 组件当中搜索框的使用

YZRHANYU的博客

11-12

3665

vben-admin BasicTable 组件当中搜索框的使用

参与评论您还未登录，请先登录后发表或查看评论

vben admin BasicTable 表格的进阶使用之带搜索区域以及对于 useTable 中方法使用别名

YZRHANYU的博客

03-15

8046

vben admin BasicTable 表格的进阶使用之带搜索区域以及对于 useTable 中方法使用别名

Vben Admin BasicForm如何设置选项默认值，修改rules

期待变成大神的博客

10-17

1956

Vben Admin BasicForm如何设置选项默认值，修改某个字段的rules，字段联动

Vben-admin带搜索框的表格

qq_42404842的博客

07-16

7315

1.index.vue 页面： <template> <BasicTable @register="register"> </BasicTable> </template> 2.注册表格部分： const [register, { reload }] = useTable({ api: getList, // api接口，返回的数据时数组能正确渲染成功 columns, // 数据源，表格头和数据

vben admin 中 BasicTable 组件 useTable 的使用

YZRHANYU的博客

11-12

5194

vben admin 中 BasicTable 组件 useTable 的使用

vben admin BasicTable 表格组件

最新发布

m0_58537749的博客

03-28

1110

感觉挺好用的，组件很多，要学的也有很多，一直不太会使用组件，希望多加学习最后轻松使用。

Vben Admin—— vben-admin BasicTable表格按钮权限控制的两种方式

qq_43201350的博客

12-14

746

Vben Admin—— vben-admin BasicTable表格按钮权限控制的两种方式

vben BasicTable的查询条件和重置查询按钮的排序规则以及RangePicker选择时间范围时如何处理

weixin_44227793的博客

06-27

1835

关于RangePicker的一些用法（限制日期范围）vben-admin并没有太懂，欢迎大佬纠错。

vben admin框架 useForm 时间选择器固定填入实时时间

w8789760的博客

03-17

933

时间表单时间默认显示一天区间，且从前一天的 00：00：00到当前日期的23：59：59。例如（2023-03-17 00：00：00 2023-03-17 23：59：59）

Vben Admin带搜索框的表格，拿搜索的值

weixin_45815557的博客

08-23

1909

Vben Admin带搜索框的表格,拿搜索的值

vben admin配置详解（Table, Form）

weixin_43244841的博客

10-23

9812

vben admin配置详解（Table, Form）

Vben Admin BasicTable用法，自定义查询条件表格数据

期待变成大神的博客

12-12

2931

Vben Admin BasicTable用法，自定义查询条件表格数据

vben admin BasicTable表格基本使用

lipenghao111的博客

06-21

3220

9.rowKey: 'id', //根据唯一的rowKey 动态删除指定行的数据.可用于不刷新整个表格而局部更新数据。1.register: 里面是table里面的一些配置项，比如header标题、内容、查询... 详情可以文档。dataIndex: 'action', //字段。fixed: 'right', // 显示到右边。6.showTableSetting: true, //刷新按钮。7.bordered: true, //是否显示表格边框。title: '操作', 操作名称。

vben-admin BasicTable组件搜索区域插槽使用

weixin_42560976的博客

04-23

2219

BasicTable中搜索区域的插槽使用form-***的命名规则。为什么这样规定，个人猜测是使其与BasicTable中其他插槽名称进行区分，防止名称重复，出现不可预估的bug。

关于vben+admin的表单联动编辑回显问题

weixin_44864019的博客

05-27

4097

这周有做一个需求，在测试环境跑的时候发现一个表单的回显问题。需求背景：一个页面上有列表，通过列表的操作栏里的编辑来打开一个抽屉，抽屉里面是一个form表单。父选择框的options是由接口获得的，通过父选择框的onChange事件，将返回数据的children赋值给子组件的options，来渲染子选择框的options。在新增的时候流程很正常，编辑的时候也是正常的，但是！！！在我刷新页面第一次去编辑回显的时候会出现我将详情数据set给表单之后，子选择框的回显直接是value值，并不是我希望的labe

VbenAdmin antd日期选择器禁止选择当天之后的时间操作

weixin_48315912的博客

06-23

903

VbenAdmin antd日期选择器禁止选择当天之后的时间操作

vben-Admin 框架--表单问题汇总

热门推荐

xiaofiy的博客

07-07

1万+

vebn-admin

vben-admin 时间/日期选择器年-季-月

2302_76925238的博客

04-25

2170

vben-admin 时间/日期选择器年-季-月

vben admin框架BasicTable组件展示image图片字段

10-30

vben Admin是一款基于Vue.js的企业级后台管理框架，它提供了一个名为`BasicTable`的表格组件，用于高效地展示数据列表。当你需要在表格中显示图片字段（例如头像、产品图片等）时，可以按照以下步骤操作： 1. 首先，在你的表单结构中，为图片字段添加一个`<template>`标签，并指定字段名作为`field`属性，如`data:image`。 ```html <template slot="name" slot-scope="{ row }"> <img :src="row.image" :alt="row.altText || 'Image'"> </template> ``` 2. 然后，在`BasicTable`组件里，配置列选项（columns），包含你自定义的模板，并确保`render`或`formatter`中引用这个模板。 ```javascript { field: 'image', title: '图片', formatter(value) { return `<img :src="${value}" :alt="value || '默认图片'">`; }, // 或者使用 render 函数 render(h, { row }) { return h('div', [h('img', { src: row.image, alt: row.altText || 'Image' })]); } } ``` 3. 最后，确保你已经处理好图片URL的获取，这可能是从数据库查询结果、API返回的数据或是本地文件路径。记得给图片设置合适的宽度和高度，如果需要，也可以添加一些加载状态的占位图或错误提示。