Можно ли добавить изображение в таблицу ячеек в 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}} />},

Другие вопросы по тегам