Question

Ionic4项目中我们可以使用Ionic4导航条组件ion-header对项目进行布局。

ion-header官方文档地址:https://ionicframework.com/docs/api/header

Header is a parent component that holds the toolbar component. It's important to note that ion-header needs to be the one of the three root elements of a page

ion-header　用法(Usage)

javascriptreact

  
    
      
    
    My Navigation Bar
  

  
    Subheader
  


</ion-content>

import React from 'react';

import { IonHeader, IonContent, IonToolbar, IonButtons, IonBackButton, IonTitle } from '@ionic/react';

const Example: React.SFC = () => (
  
    
      
        
           {}} />
        
        My Navigation Bar
      

      
        Subheader
      
    

    
  
);

export default Example

ion-header　属性(Properties)

mode
Description	The mode determines which platform styles to use.
Attribute	mode
Type	"ios" | "md"
translucent
Description	If true, the header will be translucent. Note: In order to scroll content behind the header, the fullscreen attribute needs to be set on the content.
Attribute	translucent
Type	boolean
Default	false