Путь URL-адреса не работает во встроенном стиле компонента React - PullRequest
0 голосов
/ 17 июня 2020

Я пытаюсь указать путь к файлу png, хранящемуся в файле json, компоненту для стилизации фонового изображения, но он не работает так, как я думал ...

У меня есть реакция app.
В приложении react есть папка sr c и папка с ресурсами.
В папке с ресурсами есть файл json и файл .png.
Файл json содержит такие данные, как один ниже,

[
  {
    "url": "./assets/image.png",
  },
  {
    "url": "./assets/image.png",
  }
]

URL-адрес - это путь к файлу PNG.
URL-адрес предназначен для использования для свойства стиля фонового изображения компонента в папке компонентов.
Компонент выглядит следующим образом:

import React from 'react';
function B(props) {
  const style = { backgroundImage: `url(${props.image})`};
  return (
    <div>
      <div style={style}></div>
    </div>
  );
}
export default B;

Компонент B будет использоваться в компоненте A следующим образом: (A будет использоваться в основном приложении, и будет предоставлено свойство data - которое будет данные в json файле)

import React from 'react';
import './B';
function A(props) {
  let Bs = props.data.map((e) => {
    return (
      <Project
        image={e.url}
      />
    );
  });
  return Bs;
}
export default A;

Откуда все это go не так ??

...