2017-01-19 12 views
1

をレンダリングして、react-bootstrap Panelsの配列を渡しました。子パネルの1つがクリックされるたびに、各行を測定し、子コールバックを介して、親状態の属性が更新されます。この属性は、そのパネルが現在展開されているかどうかを確認するために、react-virtualized ListrowHeight()関数の内部で使用されます。次にrefを私のListに使って、私はとforceUpdateGrid()の方法を上記のrefと呼ぶ。反応仮想化リスト内の折りたたみパネルの使用

リストコンポーネントが行の高さと位置を正しく更新しますが、アニメーションが滑らかではありません。つまり、ブートストラップエキスパンドアニメーションはうまく動作しますが、クリックイベントの後すぐにエキスパンド行の高さの変化が起こり、アニメーションが開始され、ちょっとちょっと感じます。

この問題を回避する方法があるのか​​、これがreact-virtualizedの作品機能で予定/予定されているのか不思議でした。

ありがとうございました!

+0

こんにちはラミロ!残念ながら、私は反応仮想化の中でサイズ変更アニメーションの作業や最適化に多くの時間を費やしていません。あなたが言及した場合、サイズ変更/再配置がちょっとばらついているのを聞いても驚いていません。 Plnkr(または同様のもの)として私の実装を私と共有することができれば、私は一見して何か提案をすることができれば幸いです。 – brianvaughn

+0

@brianvaughnありがとうBrian !! 私は[plunk](https://plnkr.co/edit/SSzHqu8Ta18Oef80Eyzd?p=preview)の方がいいです。あなたがxDを見ている災害のために進んで申し訳ありません私は元のプロジェクトからそれを縮小したときに私が何かを逃した可能性が高いですが、私は望んでいません。 もう一度、この時間を作ってくれてありがとう! –

+0

問題ありません。ここでは、アニメーションを追加する方法のクイックダーティーな例があります:https://plnkr.co/edit/VanCAQmSkUejp3hbJUyJ?p=preview。バグフリーではなく、イラストだけです。 :D – brianvaughn

答えて

1

残念ながら、私は反応仮想化の中でリサイズアニメーションの作業や最適化に多くの時間を費やしていません。あなたが言及した場合、サイズ変更/再配置がちょっとばらついているのを聞いても驚いていません。

ここでは、アニメーションを追加する方法の簡単な例を示します:plnkr.co/edit/VanCAQmSkUejp3hbJUyJ?p=preview。バグフリーではなく、イラストだけです。 :D

関連する問題