React.js won't load a local file, passin background image style attribute as a prop-CodePudding

I'm trying to pass style attribute as a prop when rendering a component I've made. When I pass a local image as background: it won't load, but if it is an image address it loads as it should. Here is the folder structure.

Here is the how I'm passing the prop:

      <Key
        style={{
          background: require("./keyImages/0.jpeg"),
          backgroundSize: "70px",
        }}
      />

Thanks a lot in advance for help!

CodePudding user response：

Try

import imgUrl from "./keyImages/0.jpeg";

      <Key
        style={{
          backgroundImage: 'url('   imgUrl   ')',
          backgroundSize: "70px",
        }}
      />