持续Redux商店

Question

我使用react dropzone库，并希望在更改路线或将新文件拖放到drop zone时将文件保留在redux存储中。 这是我的相同代码沙箱示例 https://codesandbox.io/s/fervent-glitter-f3kv4?file=/src/App.js:0-803。我该如何实现？

import React, { Fragment } from "react";
import { useDropzone } from "react-dropzone";
import { useDispatch } from "react-redux";
import allActions from "./actions";
import Display from "./Display";
import "./App.css";

export default function App() {
  const dispatch = useDispatch();

  const onDrop = acceptedFiles => {
    console.log(acceptedFiles);
    dispatch(allActions.upload.uploadFiles(acceptedFiles));
  };
  const { getRootProps, getInputProps } = useDropzone({ onDrop });

  return (
    <Fragment>
      <div {...getRootProps()} className="input-area">
        {
          <div>
            <p className="input-text">Drop files here ...</p>
          </div>
        }
        <input {...getInputProps()} />
      </div>
      <div>
        <Display />
      </div>
    </Fragment>
  );
}