Как вставить ссылку в GridListTile в Гэтсби - PullRequest
Новая
       8

Как вставить ссылку в GridListTile в Гэтсби

1 голос
/ 14 февраля 2020

Я пытаюсь создать интерактивную сетку изображений в Gatsby, используя GridList Material-UI

Внутри GridListTile Я не могу поместить ссылку Gatsby вокруг моего изображения или внутри GridListTileBar. 

export default function SingleLineGridList() {

    const classes = useStyles();

  return (
    <div className={classes.root}>
      <GridList className={classes.gridList} cols={1.5} cellHeight="300">
        {tileData.map(tile => (
          <GridListTile key={tile.img} className={classes.gridListTile}>
            <Link to={`product/1`}>
                <img src={tile.img} alt={tile.title} />            
            </Link>
            <GridListTileBar
                title={tile.title}
                classes={{
                    root: classes.titleBar,
                    title: classes.title,
                }}                
                />               
          </GridListTile>
        ))}
      </GridList>
    </div>
  );
}

Я получаю сообщение об ошибке «Ошибка типа: невозможно прочитать свойство« muiName »с неопределенным значением»

Я нашел похожие примеры из прямой реакции, поэтому предположим, что это связано с компонентом связи Gatsby

Я понимаю, что, скорее всего, это как-то связано с переносом компонента , но не знаю, как это реализовать.

Как я могу сделать элемент Gatsby Link приемлемым элементом с GridListTile?

...