React-admin：在某些字符后截断TextField

Question

有没有显示截断和显示...的方法（如标题中的下图所示）？有道具吗？抱歉，但是我没有在文档中找到它。

我想在20个字符后截断标题。

提前谢谢您

Answer 1

您实际上可以操纵<List>之外的任何字段，然后让<Datagrid>呈现该字段，只要它是迭代的即可。

const CustomTitleField = ({ record }) => {
  // "record" is a prop received from the Datagrid
  let str = record.title;
  return record ? (
    {/* If length is greater than 20 characters, slice and add ellipsis.*/}
    <span>{str.length > 20 ?  str.slice(0, 20) + "..." : str}</span>
  ) : null;
};

// Then, within your list, do this...
export const CommentList => (
  <List {...props}>
    <Datagrid>
      <CustomTitleField /> // this should render with your truncate logic
      // ...
    </Datagrid>
   </List>
);
尝试一下后，让我知道如何运行！