Выбор ответа Middle Компоненты и стили обновлено
React Native: размеры окна
Вопрос
Компонент верстает две колонки на планшете и одну на телефоне. Почему при повороте планшета раскладка не меняется?
const { width } = Dimensions.get('window');
const columns = width > 700 ? 2 : 1;
export function Grid() {
return <FlatList numColumns={columns} key={columns} /* ... */ />;
}
Попробуйте сами
Выберите вариант, и откроется разбор.
Показать ответ и разбор
Коротко
Правильный ответ: Dimensions.get дал снимок один раз; нужен хук useWindowDimensions. Dimensions.get возвращает значение на момент вызова. useWindowDimensions подписывается на изменения и перерисовывает компонент при повороте, разделении экрана и изменении размера окна.
Варианты ответа
- React Native не поддерживает поворот экрана, ориентация фиксируется при запуске
- После поворота приложение нужно перезапустить, чтобы размеры пересчитались
Dimensions.getдал снимок один раз; нужен хукuseWindowDimensionsправильный ответ- Ширина в RN всегда в физических пикселях, поэтому порог 700 срабатывает неверно
Разбор
Dimensions.get возвращает значение на момент вызова. useWindowDimensions подписывается на изменения и перерисовывает компонент при повороте, разделении экрана и изменении размера окна. Поворот поддерживается, перезапуск не нужен, а размеры в логических единицах.
Ответьте сами, а не прочитайте
В тренажёре вопрос попадёт в повторения и вернётся, когда начнёт забываться. Плюс билеты с зачётом: 20 вопросов, не больше 2 ошибок.