#react-native #react-navigation
#реагировать-родной #реагировать-навигация
Вопрос:
Я использую react-navigation в своем приложении rect-native. У меня есть пользовательский компонент заголовка с изображением логотипа в нем —
lt;Container key="app-header" {...props}gt; ... lt;LogoMemo opacity={logoInvisible ? 0 : 1} /gt; ... lt;/Containergt; Компонент логотипа-это чистый компонент —
const Logo = ({opacity}) =gt; { const src = require('../assets/header-logo.png'); return ( lt;Image source={src} resizeMode="contain" style={[styles.bigLogo, {opacity}]} /gt; ); }; Logo.whyDidYouRender = true; const LogoMemo = React.memo(Logo); Но все равно логотип повторяется на каждом экране навигации, что вызывает мерцание изображения.
Я думаю, это потому, что у каждого экрана есть свой собственный Header.js компонент. Поэтому, если родитель ( WhateverScreen.js ) выполняет повторную передачу — все его дочерние элементы также передаются повторно. Есть ли способ предотвратить повторный вывод логотипа?
Спасибо
Комментарии:
1. куда вы помещаете заголовок? в навигаторе?
2. Да, в
screenOptions3. могу ли я увидеть запись проблемы (мерцание экрана)?
4. Теперь я не могу записать это.. но там ничего не видно, когда пользователь переходит на другой экран — логотип мерцает (на самом деле переход от непрозрачности 0 к 1 в качестве перехода)
5. Вы уверены, что это не из-за изменения реквизита (непрозрачности) ?