Redux: ファイルのアップロードが遅れています...ファイルオブジェクトをどこに配置しますか？

考えられる解決策の1つは、store.subscribeを使用して状態の変化をストアでリッスンすることですが、 connect(...)を使用してstore.subscribeにアクセスする方法はわかりません。 多分this.context.store.subscribe() ？

@olalonde状態をシリアライズ可能にすることをお勧めしますが、これはやわらかいものです。 これは主に、サーバー側のレンダリングと状態のスナップショットを簡単にするために存在します。これは、クライアントで状態をハイドレイトしたり、どこかに送信したりするために状態をシリアル化できる必要があるためです。 これは純粋にクライアント上で行われるため、先に進んでそのファイルオブジェクトを短期的に保存してさらに処理するのはそれほど悪くないかもしれません。

また、状態をシリアル化しても、 File記述子がオブジェクトオブジェクトにシリアル化されるため、シリアル化エラーは発生しません。

ありがとう。 アップロードアクションクリエーターを次の関数でラップすることになりました。

waitIntroMessageShowedActionCreator.js

// delays execution of `fn` until `state.session.user.ui.introMessageShowed === true`

export const initWaitIntroMessageShowed = ({ getState, subscribe }) => (fn) => () => (
  new Promise((resolve, reject) => {
    const handleChange = () => {
      const state = getState()
      if (!state.session.user.ui) return null
      if (!state.session.user.ui.introMessageShowed) return null
      /* eslint-disable no-use-before-define */
      unsubscribe()
      return Promise
        .resolve()
        .then(() => fn())
        .catch(reject)
        .then(resolve)
    }
    const unsubscribe = subscribe(handleChange)
    handleChange()
  })
)

そして私のコンポーネントでは：

class DragDropSignup extends Component {
  constructor(props) {
    super(props)
    const waitIntroMessageShowed = initWaitIntroMessageShowed(this.props.store)
    this.onSignupSuccess = waitIntroMessageShowed(this.onSignupSuccess.bind(this))
  }
 // ...
}
// ...

// pass store object as prop
const connectStore = () => (WrappedComponent) => {
  const ConnectStore = (props, context) => (
    <WrappedComponent store={context.store} {...props} />
  )
  ConnectStore.contextTypes = { store: React.PropTypes.object }
  return ConnectStore
}

export default connectStore()(connect()(DragDropSignup))

誰かに役立つ場合に備えてここに投稿する