删除搜索栏

Removing Search Bar

我最近一直在与 React-Native 和 Expo 合作。我需要一个按钮来在浏览器中打开一个网站,但搜索栏(顶部)和图标栏也不应该出现。这是一张让一切更容易理解的图片:

这是我使用的代码:

import React, { Component } from 'react';
import { Button, Text, View } from 'react-native';
import * as WebBrowser from 'expo-web-browser';

export default class App extends Component {
  state = {
    result: null,
  };

  render() {
    return (
      <View>
        <Button title="Open WebBrowser" onPress={this._handlePressButtonAsync} />
        <Text>{this.state.result && JSON.stringify(this.state.result)}</Text>
      </View>
    );
  }

  _handlePressButtonAsync = async () => {
    let result = await WebBrowser.openBrowserAsync('https://expo.io');
    this.setState({ result });
  };
}

documentation所示,可以这样隐藏:

 static navigationOptions = {
    header: null,
  };

如果您要求从 SFSafariViewController 中删除顶部和底部导航栏上的 url-bar,那么不可能。本机 safari-view-controller 应该让用户知道他们正在使用熟悉的 safari UI.

的网络浏览器

如果您真的只想显示没有控件的网页,请使用 react-native-webview。您可以在任何 react-native 视图上呈现它,并且不会有导航栏或顶部搜索栏。