Как добавить изображения в ячейку таблицы?

Используйте ~ для инвертирования False s до True s для фильтрации по False s по boolean indexing :

print (df[~df["Geo"]])
    ID    Geo  Speed
0  123  False     40
3  123  False     50
5  456  False     10
7  456  False     40

df = df[~df["Geo"]].groupby('ID', as_index=False).Speed.mean()
print (df)
    ID  Speed
0  123     45
1  456     25

И для фильтрации True s:

print (df[df["Geo"]])
    ID   Geo  Speed
1  123  True     90
2  123  True     80
4  123  True     10
6  456  True     90
8  456  True     80

df = df[df["Geo"]].groupby('ID', as_index=False).Speed.mean()
print (df)
    ID  Speed
0  123     60
1  456     85

1
задан Swati 19 January 2019 в 10:45
поделиться

1 ответ

Что вы пытались достичь?

  1. Вам необходимо добавить изображение в список данных, например, (см. замороженный йогурт):
state = {
    order: "asc",
    orderBy: "calories",
    selected: [],
    data: [
      createData("Cupcake", 305, 3.7, 67, 4.3),
      createData("Donut", 452, 25.0, 51, 4.9),
      createData("Eclair", 262, 16.0, 24, 6.0),
      createData("Frozen yoghurt", 159, 6.0, 24, 4.0, "http://images6.fanpop.com/image/photos/38900000/-Frozen-Yoghurt-frozen-yogurt-38904380-289-300.jpg"),
      createData("Gingerbread", 356, 16.0, 49, 3.9),
      createData("Honeycomb", 408, 3.2, 87, 6.5),
      createData("Ice cream sandwich", 237, 9.0, 37, 4.3),
      createData("Jelly Bean", 375, 0.0, 94, 0.0),
      createData("KitKat", 518, 26.0, 65, 7.0),
      createData("Lollipop", 392, 0.2, 98, 0.0),
      createData("Marshmallow", 318, 0, 81, 2.0),
      createData("Nougat", 360, 19.0, 9, 37.0),
      createData("Oreo", 437, 18.0, 63, 4.0)
    ],
    page: 0,
    rowsPerPage: 5
  };

  1. Вам нужно настроить функцию createData (добавлено img):
function createData(name, calories, fat, carbs, protein, img) {
  counter += 1;
  return { id: counter, name, calories, fat, carbs, protein, img };
}

  1. Вам нужно чтобы добавить столбец в заголовок таблицы:
const rows = [
  {
    id: "name",
    numeric: false,
    disablePadding: true,
    label: "Dessert (100g serving)"
  },
  { id: "calories", numeric: true, disablePadding: false, label: "Calories" },
  { id: "fat", numeric: true, disablePadding: false, label: "Fat (g)" },
  { id: "carbs", numeric: true, disablePadding: false, label: "Carbs (g)" },
  { id: "protein", numeric: true, disablePadding: false, label: "Protein (g)" },
  { id: "img", numeric: true, disablePadding: false, label: "Img" }
];

(Кстати, это столбцы, а не строки.:))

  1. Вам необходимо отобразить данные в содержание вашей таблицы:
<TableRow
                      hover
                      onClick={event => this.handleClick(event, n.id)}
                      role="checkbox"
                      aria-checked={isSelected}
                      tabIndex={-1}
                      key={n.id}
                      selected={isSelected}
                    >
                      <TableCell padding="checkbox">
                        <Checkbox checked={isSelected} />
                      </TableCell>
                      <TableCell component="th" scope="row" padding="none">
                        {n.name}
                      </TableCell>
                      <TableCell align="right">{n.calories}</TableCell>
                      <TableCell align="right">{n.fat}</TableCell>
                      <TableCell align="right">{n.carbs}</TableCell>
                      <TableCell align="right">{n.protein}</TableCell>
                      <TableCell align="right"><img src={n.img} alt={n.name} width="50" /></TableCell>
                    </TableRow>

И это все ..

0
ответ дан grenzbotin 19 January 2019 в 10:45
поделиться
Другие вопросы по тегам:

Похожие вопросы: