moroshko/react-autosuggest

Allow Immutable.Map (or Iterable) to be passed

オープン

#252 opened on 2016/09/22

 (3 件のコメント) (0 件のリアクション) (0 人の担当者)JavaScript (569 件のフォーク)batch import
help wanted

Repository metrics

Stars
 (5,940 個のスター)
PR merge metrics
 (PR metrics pending)

説明

Let's take this code:

const mySuggestions = Immutable.Map();

...

return <Autosuggest
      suggestions={mySuggestions}
      ...
    />);

This code does not work. I got:

app.js:9386 Warning: Failed prop type: Invalid prop `suggestions` of type `object` supplied to `Autosuggest`, expected `array`.
    in Autosuggest (created by Connect(Autosuggest))
    in Connect(Autosuggest) (created by AutosuggestContainer)
    in AutosuggestContainer (created by ItemNameField)
    in div (created by ItemNameField)
    in ItemNameField (created by ConnectedField)
    in ConnectedField (created by Connect(ConnectedField))
    in Connect(ConnectedField) (created by Field)
    in Field (created by Row)
    in td (created by Row)
    in tr (created by Row)
    in Row (created by renderItems)
    in tbody (created by renderItems)
    in table (created by renderItems)
    in div (created by renderItems)
    in renderItems (created by ConnectedFieldArray)
    in ConnectedFieldArray (created by Connect(ConnectedFieldArray))
    in Connect(ConnectedFieldArray) (created by FieldArray)
    in FieldArray (created by ItemsBox)
    in ItemsBox (created by Connect(ItemsBox))
    in Connect(ItemsBox) (created by Form)
    in div (created by Form)
    in form (created by Form)
    in Form (created by Form(Form))
    in Form(Form) (created by Connect(Form(Form)))
    in Connect(Form(Form)) (created by ReduxForm)
    in ReduxForm (created by AddInvoice)
    in div (created by AddInvoice)
    in div (created by AddInvoice)
    in AddInvoice (created by Connect(AddInvoice))
    in Connect(AddInvoice) (created by withRouter(Connect(AddInvoice)))
    in withRouter(Connect(AddInvoice)) (created by RouterContext)
    in div (created by Sidebar)
    in div (created by Sidebar)
    in div (created by Sidebar)
    in Sidebar (created by Sidebar)
    in div (created by Sidebar)
    in Sidebar (created by Connect(Sidebar))
    in Connect(Sidebar) (created by CompanyPage)
    in CompanyPage (created by Connect(CompanyPage))
    in Connect(CompanyPage) (created by RouterContext)
    in RouterContext (created by Router)
    in Router (created by Root)
    in Provider (created by Root)
    in Root
    in AppContainer

However, if I do

const mySuggestions = mySuggestions.toJS()

it then works, however there is a big problem.

I will lose the benefits of Immutable if I change the code to Immutable.List().toArray (or toJS)) as presented here

Also here.

Other comment about this:

Good question. I Wouldn't do it in the store though, since then you lose the abillity to do a simple object comparison (prevState !== this.state) if you'd want to optimize rendering with shouldComponentUpdate

So, in the end, the request is to support Immutable types

コントリビューターガイド