Можно ли добавить изображение в таблицу ячеек в Ant Design Tables?
Я пытаюсь создать столбец, который в свои записи будет включать небольшую картинку и имя. Как я могу сделать это с помощью таблицы Ant Design?
https://ant.design/components/table/ Я не могу найти что-либо связанное в документах или примерах.
3 ответа
В принятом ответе есть ошибка, вот как это сделать
{
title: "Image",
dataIndex: "ImageURL", // this is the value that is parsed from the DB / server side
render: theImageURL => <img alt={theImageURL} src={theImageURL} /> // 'theImageURL' is the variable you must declare in order the render the URL
}
Вам нужно объявить theImageURL
а затем используйте его с alt
а также src
.
Если вы использовали таблицу аналогично примерам, приведенным в их документах (с использованием массива источника данных)
Вы могли бы сделать что-то вроде этого
const columns = [
{
title: ',
dataIndex: 'image_link',
render: () => <img src={`image_URL_here`} />
}
]
{title: 'Image',dataIndex: 'avatar',width: 50,maxWidth: 50,render: (t, r) => <img src={
${r.avatar}
} />},