javascript - сайта - убрать заголовок главной страницы wordpress




Скрыть заголовок в стековом навигаторе (9)

На целевом экране вы должны написать это!

const Routes = createStackNavigator({
Intro: {
    screen: Intro,
    navigationOptions: {
        header: null,
    }
}
},
    {
        initialRouteName: 'Intro',
    }
);

Я пытаюсь переключить экран с помощью стека и вкладки навигатора.

const MainNavigation = StackNavigator({
      otp: { screen: OTPlogin },
      otpverify: { screen: OTPverification},
      userVerified: {
        screen: TabNavigator({
          List: { screen: List },
          Settings: { screen: Settings }
        }),
      },
    });

В этом случае сначала используется stacknavigator, а затем tabnavigator. и я хочу скрыть заголовки стека навигатора. Когда я использую навигационные опции, такие как:

navigationOptions: { header: { visible: false } }

я пытаюсь этот код на первых двух компонентах, которые используют в stacknavigator. если я использую эту строку, то получаю ошибку вроде ::


Все ответы показывают, как это сделать с компонентами класса, но для функциональных компонентов вы делаете:

const MyComponent = () => {
    return (
        <SafeAreaView>
            <Text>MyComponent</Text>
        </SafeAreaView>
    )
}

MyComponent.navigationOptions = ({ /*navigation*/ }) => {
    return {
        header: null
    }
}

Если вы удалите заголовок, ваш компонент может оказаться в местах, где вы его не видите (когда у телефона нет квадратного экрана), поэтому важно использовать его при удалении заголовка.


Если вы хотите спрятаться на определенном экране, чем делать это так:

// create a component
export default class Login extends Component<{}> {
  static navigationOptions = { header: null };
}

Если кто-то ищет, как переключить заголовок, то в componentDidMount напишите что-то вроде:

  this.props.navigation.setParams({
      hideHeader: true,
  });

когда

static navigationOptions = ({ navigation }) => {
    const {params = {}} = navigation.state;

    if (params.hideHeader) {
      return {
        header: null,
      }
    }

    return {
        headerLeft: <Text>Hi</Text>,
        headerRight: <Text>Hi</Text>,
        headerTitle: <Text>Hi</Text>
    };
};

И где-то, когда событие завершит работу

this.props.navigation.setParams({
  hideHeader: false,
});

Просто используйте код ниже на странице, которую вы хотите скрыть заголовок

export default class Login extends Component {
    static navigationOptions = {
        header: null
    }
}

обратитесь к Навигатору стека


У меня та же проблема, но я сделал свою работу с заголовками в отдельных классах с помощью navigationOptions и я использую createBottomTabNavigator чей заголовок видим, а заголовок классов не виден. Я пробовал все, как headerMode: none , header: null и так далее, но не смог скрыть заголовок bottomTabNavigator .


Я использую header : null вместо header : { visible : true } Я использую реагирующий род Cli. это пример:

static navigationOptions = { header: null } 

Я использую это, чтобы скрыть панель стека (обратите внимание, что это значение второго параметра):

{
    headerMode: 'none',
    navigationOptions: {
        headerVisible: false,
    }
}

Когда вы используете этот метод, он будет скрыт на всех экранах.

В вашем случае это будет выглядеть так:

const MainNavigation = StackNavigator({
  otp: { screen: OTPlogin },
  otpverify: { screen: OTPverification },
  userVerified: {
    screen: TabNavigator({
    List: { screen: List },
    Settings: { screen: Settings }
   }),
 }
},
{
  headerMode: 'none',
  navigationOptions: {
    headerVisible: false,
  }
 }
);

const CallStack = createStackNavigator({
  Calls: Calls,
  CallsScreen:CallsScreen,
}, {headerMode: 'none'});

CallStack.navigationOptions = {
  tabBarLabel: 'Calls',
  tabBarIcon: ({ focused }) => (
    <TabBarIcon
      focused={focused}
      name={Platform.OS === 'ios' ? 'ios-options' : 'md-options'}
    />
  ),

   header: null,

        headerVisible: false,

};




expo