提问者:小点点

从卸载的输入ReactJS Redux上载文件


我有5步反应。 表单数据存储在Redux中。 我在第3步也有一个文件上传。 当我转到步骤x+1时,步骤x被卸载。 目标是执行文件上传的最后,第5步,当我没有挂载的输入文件。 我的计划是将event.target.files存储在redux中,在最后一步访问它,并使用这个对象上传文件。 它会起作用吗,浏览器会允许我做这样的把戏吗?

提前致谢


共1个答案

匿名用户

它可能不可行,但是有了React新的Hooks API,Redux不再是小型web应用程序所必需的。 我会考虑从Redux迁移到useste钩子。

如果您这样做,您可以为整个表单拥有一个组件,为五个步骤中的每一个步骤拥有几个子组件。 在最后一步中,您可以从组件状态上载文件,而不是从Redux存储中上载文件。

话虽如此,如果您决定坚持使用Redux,您必须确保在文件上传后立即发送一个操作,以便将其填充到商店中。 一旦你进入最后一步,分派一个动作将文件从商店上传到任何需要的地方。

下面是一个如何使用useState的示例:它直接取自React的文档:`

null

import React, { useState } from 'react';

function Example() {
  // Declare a new state variable, which we'll call "count"
  const [count, setCount] = useState(0);

  return (
    <div>
      <p>You clicked {count} times</p>
      <button onClick={() => setCount(count + 1)}>
        Click me
      </button>
    </div>
  );
}