标签：index return title Pro 编辑表格 ant width dataIndex 30%

工作过程中因为被选型图坑了 在使用Protable过程中，有需要对某行或者某几行进行特殊化处理。网上好像暂时好像没找到对应方法，故记录一下。

因为Protable的formItemProps是对列进行设置的，所以想要针对某行需要使用到renderFormItem来修改。

以下是设置：

const columns: ProColumns<DataSourceType>[] = [
    {
      title: '序号',
      dataIndex: 'index',
      valueType: 'index',
      width: 60,
    },
    {
      title: '各项指标名称',
      dataIndex: 'title',
      width: '30%',
      editable: (text, record, index) => {
        return false;
      },
    },
    {
      title: '年初至本月底累计总额',
      dataIndex: 'monthTotal',
      width: '30%',
      valueType: 'digit',
      editable: (text, record, index) => {
        return true;
      },
      renderFormItem: ({ index }) => {
        return [12,13,11].includes(index) ? 
        <InputNumber placeholder="请输入非负的正整数" type="number" min={0} onKeyPress={handleKeyPress}  /> 
            : 
        <InputNumber type="number" precision={2} placeholder="保留小数点后两位" />
      },
      formItemProps: {
        rules: [
          {
            required: true,
            message: '此项是必填项'
          }
        ],
      },
    },
    {
      title: '上年同期累计',
      dataIndex: 'hisTotal',
      width: '30%',
      editable: (text, record, index) => {
        return false;
      },
    },
  ];

主要的代码：

renderFormItem: ({ index }) => {
        return [12,13,11].includes(index) ? 
        <InputNumber placeholder="请输入非负的正整数" type="number" min={0} onKeyPress={handleKeyPress}  /> 
        : 
        <InputNumber type="number" precision={2} placeholder="保留小数点后两位" />
},

这边是针对11.12.13行进行的特殊化处理，我这边是这几行要设置成正整数且不可为负，其他行只需要保留两位小数。

标签：index,return,title,Pro,编辑表格,ant,width,dataIndex,30%
来源： https://blog.csdn.net/qasw460326327/article/details/121160095

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。