Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

🧐[问题] ProTable column valueType="option" 时,设置 align="center" 不生效 #6515

Closed
marcccc opened this issue Jan 16, 2023 · 3 comments

Comments

@marcccc
Copy link

marcccc commented Jan 16, 2023

提问前先看看:

https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way/blob/main/README-zh_CN.md

🧐 问题描述

如题

💻 示例代码

columnRender 133 行根据 column.align 配置设置 justifyContent css 属性

🚑 其他信息

@marcccc marcccc changed the title 🧐[问题] ProTable valueType="option" 时,设置 align="center" 不生效 🧐[问题] ProTable column valueType="option" 时,设置 align="center" 不生效 Jan 16, 2023
@chenshuai2144
Copy link
Contributor

TAutomatically replying with ChatGPT can be attempted, but it cannot be guaranteed to be completely accurate and may not fully address all issues. Please feel free to reply if you have any further questions or concerns.
此回复基于 ChatGPT 自动生成,可以尝试下方案,官方员会在一定时间后继续继续处理。

根据你提供的信息,可以尝试在columnRender函数中加入一个text-align: center的样式,这样就可以实现单元格内容居中了:

// ProTable columnRender 中
render: (dom, record, index) => {
  return <div style={{ justifyContent: align, textAlign: 'center' }}>{dom}</div>
}

另外,可以查看 antd 的官方文档,里面提到列的对齐方式可以通过 columns 中的 align 属性进行设置,可以设置为 'left''center''right',示例如下:

import ProTable from '@ant-design/pro-table';

const columns = [
  {
    title: '姓名',
    dataIndex: 'name',
    align: 'center',
  },
  {
    title: '年龄',
    dataIndex: 'age',
    align: 'left',
  },
];

<ProTable columns={columns} dataSource={data} />;

具体可以参考 antd 官方文档

@github-actions
Copy link

Hello @marcccc. We totally like your proposal/feedback, welcome to send us a Pull Request for it. Please provide changelog/TypeScript/documentation/test cases if needed and make sure CI passed, we will review it soon. We appreciate your effort in advance and looking forward to your contribution!

你好 @marcccc,我们完全同意你的提议/反馈,欢迎直接在此仓库 创建一个 Pull Request 来解决这个问题。请务必提供改动所需相应的 changelog、TypeScript 定义、测试用例、文档等,并确保 CI 通过,我们会尽快进行 Review,提前感谢和期待您的贡献。

giphy

@yorickshan
Copy link

怎么解决的?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants