Dingdong_client/components/HomeHeader.js

import * as React from 'react';
import { Platform } from 'react-native';
import { StatusBar } from 'expo-status-bar';
import Constants from 'expo-constants';
import { Appbar, Menu } from 'react-native-paper';
import { useBoolean } from '@umijs/hooks';
import useModel from 'flooks';
import words from '../flooks/Words';
import user from '../flooks/User';

export default function Header() {
  const { state, setTrue, setFalse } = useBoolean(false);
  const {
    setlocal,
    TlocationWord,
    TchangeToth,
    TchangeToChinese,
    local,
  } = useModel(words);
  const { logout } = useModel(user, []);

  return (
    <>
      <StatusBar backgroundColor="transparent" style="dark" translucent />

      <Appbar.Header
        theme={{ colors: { primary: '#fff' } }}
        style={{
          elevation: 0,
          shadowOffset: {
            width: 0,
            height: 0,
          },
          shadowOpacity: 0,
        }}
      >
        <Appbar.Content title={TlocationWord} titleStyle={{ fontSize: 16 }} />

        <Menu
          visible={state}
          onDismiss={setFalse}
          anchor={<Appbar.Action icon="dots-vertical" onPress={setTrue} />}
        >
          <Menu.Item onPress={logout} title="退出登录" />
          <Menu.Item
            onPress={() => {
              setlocal();
            }}
            title={local ? TchangeToChinese : TchangeToth}
          />
          <Menu.Item onPress={() => {}} title="版本06.16.1" />
        </Menu>
      </Appbar.Header>
    </>
  );
}