reactjs - Reactでは、動的変数をconst CSSスタイルリストに渡す方法は?

Question

ユーザーがプロフィール写真をアップロードできるように、react-dropzoneを使用しています。

カスタム CSS を次のように定義します。

const dropzoneStyle = {
  width: `200px`,
  height: `200px`,
  backgroundColor: `#1DA1F2`,
};

DropZone 入力をレンダリングするメソッド内で、ユーザーがアップロードする画像を選択した後に入力されるファイル プレビューであるかどうかを検出できます。

私がやりたいことは、file.preview が存在する場合、file.preview を dropzoneStyle に送信して、背景画像が CSS に追加されるようにすることです。

const renderDropzoneInput = (field) => {
  const files = field.input.value;
  let dropzoneRef;

  if (files[0]) {
    console.log(files[0].preview)
  }

  return (
    <div>
      <Dropzone
        name={field.name}
        ref={(node) => { dropzoneRef = node; }}
        accept="image/jpeg, image/png"
        style={dropzoneStyle}
      >

files[0].previewReactでスタイルdropzoneStyleに渡すにはどうすればよいですか?