今後のCSSトランジションのプロパティ

は私が反応とのインタフェースを構築しています、と私は、私はクラスを変更した後のdivコンテナのプロパティ（clientWidthとclientHeight）を取得したいのですが取得します。今後のCSSトランジションのプロパティ

主な問題は、width/heightプロパティのCSSの遷移が0.2秒あるため、React（componentDidMount）またはMutationObserverのおかげで（将来の）DOMの変更を検出しようとするたびに、トランジションが始まる直前にclientWidthとclientHeightを取得します。

理想的には、私は、サブコンポーネントを再レンダリングし、彼らが必要とする将来の幅/高さを与えることができるので、移行後に適用されようとしているプロパティを取得したいのですが。

これを行うには何か良い方法はありますか？私は事前にあなたに感謝:)

出典

2016-11-30 elTaan

あなたはCSSの遷移終了のトリガを書くことができます：https://davidwalsh.name/css-animation-callback

このイベントがトリガされるまで、あなたは高さと幅の検出を待つことができます。

出典

2016-11-30 11:27:42

ありがとうMartin P.！しかし、これは私が夢見てきた奇跡的な解決策ではありません：D これは実際の移行の終了を検出するための良い解決策ですが、私は移行が（で起動する前に知っておく任意の可能性があったかどうかを知りたいです私の場合）有効になる要素のクライアントの幅/高さをpxで指定します。現在のところ、どのような解決策が存在するのか疑問に思うのですが、私はこのトピックで私のチャンスを試しました。しかし、私はあなたのソリューションには感謝しています。これは、近い類似の問題に役立つかもしれません！ :) – elTaan

さて、今私は理解しています。これは、あなたが探しているものです。のdocument.getElementById（ "yourId"）getBoundingClientRect（）高さ;。。 –

申し訳ありませんが、まだ@ martin-pがありません：D 要素の寸法を取得する方法（** clientWidth/clientHeight ** ie）私が得たいのは、_future_幅と高さです** **クラスイベントが検出されました** - > **遷移検出** - > _futureプロパティが計算されました。 React_ - > **遷移開始** - > **でそれを伝播するために取得することができます。子レンダリングは、正しい '未来'のプロパティと同期的に開始します。** - > **遷移終了;両端をレンダリング子ども** – elTaan

今後のCSSトランジションのプロパティ

答えて

関連する問題