Integrating react-redux, react-final-form and react-bootstra

Question

我正在尝试设置react-boostrap-typeahead以从redux存储中获取数据，并将 typeahead 状态与 react-final-form 一起存储。 问题是react-bootstrap-typeahead附加了多个状态，这两个状态都需要跟踪才能使此设置正常工作。

1. 文本输入状态
2. 所选选项

我解决此问题的首选方法涉及final-form-set-field-data，如下所示： https://codesandbox.io/s/rl81o5765o

该代码将无法正常工作，因为Form组件不知道字段数据的更改。 有没有更好的方法来解决这个问题？

Answer 1

我在这里想出了一个解决方案：

https://codesandbox.io/s/5m4w2909k

方法是引入一个withKeyword HoC，利用final-form-set-field-data向现场注入keyword和updateKeyword道具。 Typeahead必须单独连接到redux存储。