メディアクエリでリアクションレンダリングを停止する方法

Question

要素を表示するかどうかをメディアクエリを含む既存のCSSがあります（したがって、考慮する必要があります）。 CSSは期待通りに動作しますが、Reactは、メディアクエリによって要素が再レンダリングされないようにしてもDOMを再レンダリングして再構成するという問題があります。

反応しないように指示する手段はありますか？ Reactでメディアクエリーを検出し、メディアクエリーがそうでないと表示しない方法はありますか？

Answer 1

あなたはmatchMediaを使用して

shouldComponentUpdate(nextProps) { 
    return window.matchMedia('(min-width: 768px)').matches 
}