<WindowWidthQuery>

Use it for responsive design, renders only the first child that matches query against the current window width.

Usage

import {WindowWidthQuery} from 'libreact/lib/WindowWidthQuery';
import {View} from 'libreact/lib/View';

<WindowWidthQuery>
  <View maxWidth={300}>
    Up to 300px
  </View>
  <View>
    More than 300px
  </View>
</WindowWidthQuery>

<WindowWidthQuery> is simply a shortcut for

<WindowSizeSensor>{({width}) =>
  <WidthQuery width={width}>
    {/* Your queries here... */}
  </WidthQuery>
}</WindowSizeSensor>

results matching ""

    No results matching ""