Material UI: как использовать собственное изображение в аватаре

Я хочу использовать изображение на аватаре. Но я не могу получить желаемый результат.

Это структура моего проекта.

имя проекта -> пакеты -> портал -> общедоступный -> favicon-16x16.png

      <Avatar
        src="/public/favicon-16x16.png"
        className={classes.avatar}
      />
         <Avatar
           src="packages/portal/public/favicon-16x16.png"   
           className={classes.avatar}  
         />

Я пробовал два вышеуказанных способа. Но не загружайте, чтобы получить изображение. Любая помощь приветствуется. Спасибо.


person Tanu    schedule 05.09.2019    source источник
comment
Я почти уверен, что вам нужны скобки вокруг реквизита, даже если это струны. Вы также не показываете код того, как вы пытаетесь его использовать. Кроме того, мы не можем видеть, правильно ли вы используете локальные изображения. Проверьте этот ответ об импорте локальных изображений stackoverflow.com/a/44158919/10140836. Вы должны предоставить больше информации в своем сообщении.   -  person Rob B    schedule 05.09.2019
comment
Это правильный путь: <Avatar src={`${process.env.PUBLIC_URL}/apple-touch-icon.png`} className={classes.avatar} style={{ borderRadius: 0 }} /> Спасибо @RobB   -  person Tanu    schedule 05.09.2019
comment
@RobB вам абсолютно не нужно использовать скобки со строками в JSX. Достаточно просто использовать кавычки.   -  person ndugger    schedule 05.09.2019


Ответы (1)


Это правильный путь:

<Avatar src={`${process.env.PUBLIC_URL}/apple-touch-icon.png`} className={classes.avatar} style={{ borderRadius: 0 }} />

Спасибо @RobB

person Tanu    schedule 19.02.2020