删除搜索栏
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 视图上呈现它,并且不会有导航栏或顶部搜索栏。
我最近一直在与 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 视图上呈现它,并且不会有导航栏或顶部搜索栏。