onsen react导航器推页覆盖最后一页
Onsen React导航器是一个用于构建移动应用程序的开源UI库，它提供了丰富的UI组件和交互效果，可以帮助开发人员快速构建跨平台的原生应用程序。导航器是Onsen React中的一个重要组件，它用于管理应用程序中不同页面之间的导航和切换。
推页覆盖是导航器的一种导航模式，它指的是在切换页面时，新页面从当前页面的上方推入，并覆盖在当前页面之上。这种导航模式常用于实现页面之间的层叠效果，使用户感知到页面之间的关联性。
推页覆盖的最后一页是指在使用推页覆盖导航模式时，最后一个页面被新页面覆盖后的状态。通常情况下，最后一页会被隐藏，直到用户返回上一页或执行其他导航操作。
Onsen React提供了丰富的导航器组件和API，可以轻松实现推页覆盖导航模式。开发人员可以使用Onsen React的Navigator组件来管理页面之间的导航，并通过配置不同的导航模式来实现推页覆盖效果。
推荐的腾讯云相关产品：腾讯云移动应用托管（Mobile Application Hosting），该产品提供了一站式的移动应用托管服务，支持快速部署和管理移动应用程序。您可以通过腾讯云移动应用托管来部署和托管使用Onsen React导航器构建的移动应用程序。
腾讯云移动应用托管产品介绍链接地址：腾讯云移动应用托管
请注意，本回答仅供参考，具体的技术选型和产品选择应根据实际需求和情况进行评估。
相关·内容
1回答
如何动态设置起始页
、、、
我有一个Onsen用户界面应用程序与一个ons导航。什么是批准的方式，以设置第一页将动态显示在应用程序启动？将根据存储在本地存储中的某些参数选择要显示的页面。
浏览 1提问于2014-12-25得票数 0
回答已采纳
我在Onsen UI样板上下载了一个选项卡式应用程序。然后，我为其中一个选项卡添加了第二个页面导航器。第二个选项卡将有两个页面可用。当我访问此选项卡时，问题出现了，请转到选项卡的第二页，然后使用popPage返回到选项卡的第一页。页面转换完成后，我会得到如下结果：
Error: no such object: [object Navigator]
at Object.aliasStack.unregister (http://dev-m.scrippa.com/lib/onsen/js/onsenui.js:10848:17)
我使用这个方法弹出：
<ons-button ng-clic
浏览 0提问于2014-08-16得票数 0
我在我的路线页面上设置了这个导航器，我期望当我按this.props.navigation.goback函数时，如果我在第三页，它应该带我到第二页，但是很明显，它会带我到第一页。
即使有了Android或IOS的自然goback行为，它也会把我带到第一页。
我通过
this.props.navigation.navigate('Screens')
NavigatorPage:这里我使用的是DrawerNavigator
import { createAppContainer ,createDrawerNavigator} from 'react-navig
浏览 0提问于2019-01-21得票数 2
回答已采纳
我正在使用react导航模块，并使用goBack()函数关闭当前页面并导航到上一页面。在屏幕导航时，必须删除所有参数和实例。在文档中，他们说：“可以选择提供一个键，它指定返回的路径。默认情况下，goBack将关闭调用它的路径。如果目标是返回任何地方，但没有指定要关闭的内容，则调用.goBack(null)；
‘这是什么意思?如果我使用goBack(null)而不是goBack()会有什么变化?谢谢
浏览 0提问于2017-10-12得票数 2
2回答
我想要在页面之间使用react原生导航。我一共有三页。我可以从第一个->、第二个->第三页导航。
但是，从第三页开始，当我试图返回到第一页时，我得到了一个错误“未定义的不是一个对象(evaluating'_this2.props.navigation.navigate).。
在第三页中，与其他两页不同，我导入了一个类来导航回第一页，但是它给了我一个错误。下面是我的密码。
这是我的App.js：
import React, {Component} from 'react'
import {View,Text,StyleSheet,ScrollView,Imag
浏览 3提问于2018-07-05得票数 0
回答已采纳
1回答
请帮帮我。我正在制作移动应用程序。我有底部选项卡导航，这是3个主要页面之间的导航。我已经做了第一页和第二页之间的导航，但没有标签底部导航，与按钮。当我做了这个的时候，我没有得到我想要的东西。如果你帮我，我会很高兴的。当我从第一页导航到第二页时，我有两个标题。但我想说一句： ? 有两个标题，第一个是<，第二个是“课程”，我想让它像这样"<课程“。请帮帮我。代码： // 1st page
import Courses from './Courses'
<Button
onPress={() => {
navigate('C
浏览 15提问于2019-06-06得票数 0
Onsen-UI问题：
如何在onsen-ui的左上角(导航部分)显示我的徽标？是否有一些属性可以告诉我想在这里显示一个徽标，如下所示：
在子页面上，我希望将徽标放在导航回页旁边
<徽标
我想要显示的不是“最近”，而是示例图像(上面显示的只是为了说明最近被徽标替换)
浏览 13提问于2014-07-12得票数 1
1回答
我知道如何在Onsen 1中获取参数，例如
$scope.navigator.getCurrentPage().options.param1
但我找不到任何有用的文档或来源来获取Onsen 2中的非导航器数据。请帮助我。
浏览 3提问于2017-09-21得票数 0
我已经成功地使用React导航V3在我的应用程序中创建了一个导航抽屉。但当我使用抽屉打开两个页面后，单次按下后，页面直接重定向到主页，而不是前一页时，问题就出现了。 我希望应用程序流与stacknavigator类似，但在drawernavigator中也不能使用back()函数。这是我的抽屉导航器： const DrawerNavigator = createDrawerNavigator({
Home: {
screen:HomeScreen
},
Events: {
screen: EventsScreen
},
Wa
浏览 23提问于2019-03-11得票数 0
回答已采纳
我正在测试我的代码，得到了一个错误。我需要按下一个按钮，然后转到下一页。
首先，我创建了Safay.js并编写了代码来设置这个页面中的初始路由。然后，我创建了buttonsubmit.js，以便当我按下按钮时，它将转到下一页，route.js。但是，在测试时，我会得到一个错误。我只是重新检查了我的代码，这可能是我输入的错误，或者可能是我不知道的事情。
这是我的错误：
ButtonSubmit.js文件中的错误:22
这是我的密码：
Safay.js
import index from './index.js';
import React, { Component, P
浏览 1提问于2017-02-19得票数 0
OnsenUI很棒。又快又容易。然而，在控制器中控制Onsen逻辑的文档并不多。
例如，我想在控制器内执行一个$location.path('/newpath')。在文森做得怎么样？我在控制器函数中尝试了"ons.navigator.pushPage('partials/latestjob.html');“，但没有工作。我们是否仅限于在Onsen中单击ng键转到另一个页面？
谢谢。
浏览 2提问于2014-06-03得票数 4
回答已采纳
我有一个意大利面的滑动菜单。当我点击一个菜单选项(电子设备)时，它会将我带到第一页。从第一页我使用导航器推送方法导航到第二页。在第二页中，我确实看到了滑动菜单，但当我单击或滑动滑动菜单时没有任何反应。但是当我导航回到第1页时，它就可以工作了。
<!doctype html>
<html lang="en" ng-app="myApp">
<head>
<meta charset="utf-8">
<link rel="stylesheet"
浏览 2提问于2015-07-31得票数 2
2回答
我有一个页面1，它可以打开页面2。 页面2有一个Navigator Widget，它在相同的上下文中更改一些小部件。 这很好用，但我正在尝试从第2页退出到第1页。 以下代码不起作用： Navigator.pop(context); 你知道怎样才能回到第一页吗？谢谢
浏览 21提问于2019-09-19得票数 2
在自定义控件上，我有一个迭代向量的repeat控件。此repeat控件确实绑定了一个寻呼机。当页面导航器位于控件的第一页或最后一页时，我希望隐藏上一页和下一页的链接。
当然，要隐藏前面的是简单的>>，向getpageCount() > 0添加一个呈现属性。下一个链接有点问题。pager类没有getCurrentPage()方法。因此，我找不到我当前在寻呼机上的哪个页面。
有没有人知道如何在使用SSJS的寻呼机上隐藏/显示下一个/上一个链接？
浏览 0提问于2012-05-07得票数 0
回答已采纳
当我使用this.navCtrl.push(TwoPage)在我的模式中推送另一个页面时，推页显示如下所示：
该模式的创建方式如下：
let modal = this.modalCtrl.create(OnePage);
modal.present();
浏览 10提问于2017-02-08得票数 1
回答已采纳
2回答
我有一个使用案例，流程如下: Dashboard->AddProductScreen1.0->AddProductScreen2.0->产品详细信息屏幕
这些屏幕位于堆栈导航器中。
添加产品屏幕是一个多页表单，用于填写产品的详细信息。在AddProductScreen2.0上，当单击AddProduct按钮时，将进行API调用以保存产品。如果调用成功，我们将转到ProductDetailsScreen。此时，我想从堆栈导航器中删除AddProductScreens，以便在单击back按钮时，我们将再次移动到控制面板，而不是AddProductScreens
如何在原生reac
浏览 10提问于2021-02-17得票数 0
1回答
我用Navigator创建了一个Android应用程序。
在我的第一页，我想按不同的信息到下一页，如果我按下一个按钮或其他。
我创建了gotoNext函数，如下所示。但是，我不明白我怎么能用一个代表按钮杆或天线的论点来代替我的踏板：“测试”。
谢谢你的帮助。
class LoginPage extends React.Component {
render() {
return (
<Navigator
renderScene={this.renderScene.bind(this)}
navigator={this.prop
浏览 3提问于2015-11-20得票数 2
回答已采纳
我正在开发一个使用onsen ui和angular js的应用程序。假设我在同一页上有3个html文件(物理)，而不是on -template文件。如何制作将在所有三个页面上显示的菜单的标题。
浏览 3提问于2015-08-07得票数 1
我正在尝试使用带有滑动菜单的Onsen-UI，当我在设备(Android)上测试时，我发现页面/导航器之间的转换存在延迟。在新页面更改之前，前一页会显示一点。
浏览 0提问于2014-05-27得票数 1
我刚刚开始使用Monaca和Onsen UI，并且我已经设置了带有滑动菜单和导航器的页面。我有一个后退按钮，根据定义，除非页面堆栈大小至少为2，否则不应该显示该按钮。当我调用resetToPage时，导航按预期工作，但后退按钮显示出来，尽管它不应该显示。
当我调用任何javascript函数时，这个按钮就消失了，所以页面在调用resetToPage时可能不会正确地刷新自己。在导航器上调用console.log会返回pages: Array1，但调用它也会移除back按钮，因此这可能不是真正的结果。
第1页
<ons-navigator var="myNavi">
浏览 0提问于2015-11-04得票数 1
由于标题中提到的问题，我已经把头撞在墙上好几天了。我正在尝试使用Onsen UI和React实现导航功能。但是，在我单击导航后，UI导航到一个空白页面，并立即返回到第一个页面。下面是我的代码。
import React from "react";
import { Page, Navigator, Button, SearchInput } from "react-onsenui";
function EditorView() {
return <Page>This is the editor page!</Page>;
}
fu
浏览 9提问于2020-04-12得票数 3
我使用react本机和导航响应导航V2创建了基本ui，我的应用程序的条目文件(App.js)如下所示
//App.js
const App = createSwitchNavigator(
{
StartupScreen: Validator, //validating accesstoken existing or not if existing navigate to Dashboard otherwise login page
Login:Login,
DashBoard: Dashboard //tabbed view
},
{
in
浏览 2提问于2018-05-30得票数 0
在我的项目中，我从当前页面(2)移动到上一个页面(1)，并通过构造函数使用appBar中的back按钮更新了一个列表 onPressed: () => Navigator.pushReplacement (
context,
new MaterialPageRoute (
builder: (context) => new PagesListPage (
pagesList: list Pages,
)),
浏览 18提问于2019-10-03得票数 0
我正在使用react material-ui tables组件，我需要在分页的页面之间导航。如何添加加载第一页和最后一页的选项，或在表分页中设置所有页的列表？
谢谢。
浏览 0提问于2017-10-12得票数 1
2回答
我正在寻找学习OnsenUi来取代我的phonegap项目中的Jquery。
我想做一个登录页面，并在切换到主页后。
要做到这一点，下面是我的html代码：
<!doctype html>
<html lang="en" ng-app="myApp">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=
浏览 0提问于2015-01-27得票数 0
我遇到了显示最后一页的问题当用户点击add new row..If时，我们可以显示最后一页，用户可以直接查看新添加的行..我正在使用prime react和react js
浏览 27提问于2021-05-06得票数 0
我有一个过滤下拉列表。我在另一页上有一个按钮。当我单击另一页上的此按钮时，如何返回到另一页上下拉列表的其他选项？
DropdownPage
CustomDropdownButton<bool>(
hintText: "Select Filter",
value: controller.selectedFilter.value,
items: [
DropdownMenuItem<bool>(
child: Text("Sales"),
浏览 12提问于2022-03-04得票数 1
在Onsen中，默认情况下，当按下设备后退按钮时，应用程序将关闭/退出。在Onsen中有什么方法可以控制它来模拟的操作/页面历史吗？
谢谢!
浏览 11提问于2014-06-04得票数 5
回答已采纳
我试图导航到第一页后，用户注销！并得到这个错误：
未定义不是一个函数(计算'navigation.dispatch')。
我的操作创建者代码如下：
import {NavigationActions} from 'react-navigation';
import {AsyncStorage} from 'react-native';
import {applyMiddleware as dispatch} from "redux";
export const userRemove = (navigation) =>
浏览 2提问于2018-10-04得票数 0
回答已采纳
我有一个很长的Onsen UI页面。滚动到页面底部后，我可以在同一页面中加载新内容。但是，页面仍然显示在相同的当前位置。
注意:我使用的是ons-list。在列表刷新后，是否会自动滚动到列表顶部？
我想知道在加载了新内容后，我如何才能登上榜首。
浏览 0提问于2015-05-29得票数 2
我试图使用Navigator.push转到下一页，同时只更改页面上的正文。例如，当我在materialApp中包装第2页的索引时，我才得到这个结果。但是当我决定制作动画时(它平滑地把旧页推到左边，把新页推到右边)，原来是她推旧页，但后面是完全一样的静止的页面，后来被新的页面挡住了。
我理解这一点的方式是，第一个被删除的页面是一个索引2页，它被包装在MaterialApp中，它后面是整个应用程序的固定的MaterialApp。目前，我不知道如何删除一个固定的页面。我给出了一个图片，我目前是如何在应用程序中导航，它可能不是完美的，但我不知道更好，任何帮助将不胜感激。
在许多应用程序中，我
浏览 1提问于2020-06-05得票数 1
在Onsen上，我很难深入研究AngularJS。
下面的代码错了，我不明白。我想显示字符串‘第一页’而不是{{initialText}}。
请给我一些建议。
Index.html
<head>
...
...
<script>
var module = ons.bootstrap('myApp', ['onsen']);
module.controller('AppController', function($scope) { });
module.controll
浏览 1提问于2015-12-13得票数 2
回答已采纳
2回答
我曾经使用react-native开发移动应用程序，原因很多，我已经放弃了。但是，我喜欢JavaScrip应用程序的一件事是，您有像redux这样的状态容器。
我想知道人们如何在iOS和Android?中管理全球国家。
有两种方案可以帮助您理解我的问题：
用户已登录。当用户在屏幕之间导航时，我如何知道用户是否已登录？我必须在周围传递currentUser属性吗？
假设我正在编写twitter克隆，用户可以like一条推特或点击它，然后转到另一页查看推特的细节。用户还可以在细节屏幕上like推特。返回时，主屏幕上的like按钮也会被激活，因为用户liked在细节屏幕上发布了这条消息。
浏览 0提问于2018-03-11得票数 2
回答已采纳
2回答
当键盘打开时，我想把页面向上推。我的页面底部有下一页按钮(现在是它的底部导航栏)，但是当我填充字段并且键盘在下一页按钮停留在键盘下面时，我希望键盘向上推高底部导航栏，并且总是可以看到。
Scaffold(
body : Center(
child: SingleChildScrollView(
child: Column(
children: [
..mywidgets
],
),
),
),
bottomNavigationBar: nextButtonWidget(
浏览 4提问于2022-09-09得票数 0
回答已采纳
1回答
我刚刚开始使用Onsen，并从网站下载了选项卡栏模板。制表栏模板有两个“主”页面:时间线和设置。
我在“时间线”页面中添加了一个子页面，我使用myNavigator.push(.)调用该页面。
我现在的结构是这样：
时间线
孩子
设置
让我们假设现在我显示的是时间线>子页面:当我单击“设置”选项卡时，我显然被带到了“设置”页面。现在，从“设置”页返回到上一页(时间线堆栈中的子页面)，链接将我带回到父页(时间线)。
我想保持活跃的最后一页访问的堆栈，在我的情况下，子页面，有一个简单的方法吗？
抱歉，也许有点乱，我希望你们能理解我的意思。
谢谢!
浏览 1提问于2015-05-21得票数 2
1回答
我对把导航仪和标签条混合在一起有疑问。
解释:主页面(主page1)由两个子页面(tab1和tab2)组成，它们通过选项卡访问，而其他页面(page2和3)是通过导航器访问的。tab1页面是第一个激活的页面。
布局: tab1和tab2页面具有相同的工具栏(顶部)。page2和page3有不同的工具栏，有后退按钮和另一个按钮重定向到主页tab1。
我的代码是这样的，但我不知道它是正确的还是最好的方法：
<!doctype html>
<html lang="en" ng-app="app">
<head>
<met
浏览 1提问于2015-04-23得票数 3
回答已采纳
有没有一种向UIScrollView添加圆圈滚动的方法？例如，如果滚动到最后一页，则第一页应该是下一页，如果回滚到第一页，则最后一页应该是下一页。
然而，我一直在尝试使用scrollViewDidScroll函数，当滚动到最后一页时，视图跳回第一个视图，而不是滚动到它或将它添加到它旁边。
我的代码是：
func scrollViewDidScroll(scrollView: UIScrollView) {
if (scrollView.contentOffset.x > scrollView.frame.size.width){
scrollVi
浏览 2提问于2015-07-07得票数 1
我正在尝试使用react本地软件来构建一个android应用程序。这是我的布局：
HomeScreen -向用户提供登录选项，并导航到Page2 Page2 (彩色黄色)-提供一个抽屉菜单导航到第3页(搜索页)或第4页(添加页面) Page3 (彩色红色)提供一个视图与红色背景和文本Page4 (颜色绿色(-提供一个视图带绿色背景和文字)
My page4 ：我没有看到第2页(黄色屏幕) **在登录成功后，主屏幕自动导航到第2页，但是没有显示Page2 (黄色)，而是得到一个带有滑块菜单的红色页面，如果我选择了带有滑块菜单的page4(绿色)。
为了清晰起见，请参阅附呈的图片(注意:即使正在呈
浏览 1提问于2020-04-21得票数 1
回答已采纳
我已经从反应导航5升级到6：
- "@react-navigation/bottom-tabs": "^5.10.6",
- "@react-navigation/material-top-tabs": "^5.3.15",
- "@react-navigation/native": "^5.8.6",
- "@react-navigation/routers": "^5.6.0",
- "@react-navigation/st
浏览 13提问于2022-11-22得票数 1
回答已采纳
我在这里遵循这个教程：
教程中的人正在使用TabNavigator，但这不再是正确的方法，所以我改用createBottomNavigator。
下面是我的MainScreen组件代码
import React from 'react';
import {
View,
Text,
StyleSheet
} from 'react-native';
import ProfileTab from './AppTabNavigator/ProfileTab'
import LikesTab from './AppTab
浏览 9提问于2018-07-21得票数 0
有没有办法使用Onsen-UI作为UI前端，或者只使用React Native的常规HTML5？
我知道React Native应该与React.js一起使用，但我想使用不同的前端框架有两个原因，比如Onsen或Ionic。首先，我现在不想学习一个新的框架，我没有时间。其次，我现有的基于Cordova的应用程序是用Onsen构建的，我想将其转移到React Native上。
提前谢谢。
浏览 3提问于2016-05-31得票数 3
我在一个Android反应本机应用程序中有一个导航器。我使用navigator.push()导航到另一个页面。“后退”按钮弹出导航器并返回一页似乎很自然，但这不是happening.After经常搜索的内容，我得到了一个函数，用于解决相同的问题，但我认为我把它放在了错误的位置--请看这个帮助我。
var React = require('react-native');
var {
AppRegistry,
StyleSheet,
Text,
View,
Navigator,
TouchableOpacity,
} = React;
var SCREEN
浏览 2提问于2017-03-24得票数 2
回答已采纳
1回答
我在knockoutJS中使用的是onsen。视图模型的页面导航和绑定就像这个代码页()一样：
window.OnsNavigatorElement.rewritables.link = function(element, target, oons, callback) {
ko.applyBindings(options.viewModel, target);
callback(target);
};
function gotoFoobar(){
document.querySelector('ons-navigator').pushPage(
浏览 3提问于2016-10-05得票数 1
回答已采纳
我有2页，在第一页我有一个按钮，这是点击将打开第二页，在第二页我有变量number = 999;，所以当我回到第一页时，我想要显示的数字print(number);或显示在Text(number)上如何做与dispose()？
@override
void dispose() {
super.dispose();
// send data to the first page
}
谢谢你的回答
浏览 7提问于2019-08-10得票数 4
我想推屏幕，但我得到了以下错误(无法读取属性推送的未定义)，.Anyone知道如何使用以下代码推送屏幕？(我已在App.js文件中正确地注册了屏幕)
class LoginForm extends React.Component {
registerscreen = () => {
this.props.navigator.push({
screen: "testapp.RegisterScreen",
title: "RegisterScreen",
navigatorSt
浏览 0提问于2018-06-19得票数 0
回答已采纳
2回答
我是新的反应原住民，我有一个非常简单的第一页，我正在测试。我唯一一件很难理解的事情就是在最上面的区域有一个标题视图。正如你所看到的，我的应用程序现在看起来像，有一个巨大的空白，里面有"Home“。我正试着彻底摆脱它，在整个过程中都有我的背景色。我唯一的问题是我甚至不知道那是从哪里来的。这是我的密码，谢谢。
这是我的HomeScreen
import React from "react";
import { StyleSheet, Text, SafeAreaView, Platform } from "react-native";
import { St
浏览 1提问于2022-01-23得票数 0
2回答
我有一个带有嵌套表的表。当我打印这一页时，单元格在分页符时被拆分。
有没有可能我可以控制它跳转到下一页，而不是分割中间？
浏览 3提问于2011-02-28得票数 2
回答已采纳
1回答
标签和堆栈，当使用时，出现多个标题后跳转到下一个页面样式，我的反应-导航配置有问题吗?有更好的解决方案吗？这是应用程序入口：
App.js
import React, { Component } from 'react';
import {
Platform,
StyleSheet,
Text,
View
} from 'react-native';
import { StackNavigator, TabNavigator } from 'react-navigation';
import { Button } from
浏览 3提问于2017-12-22得票数 0
我想从一页纸回到家里。
我正在使用这个例子：。
但是，如果我在browsehotels.html页面中放置了一个按钮，以便像这样返回家：
<ons-list-item ng-click="myNav.pushPage('home.html')">
back to home
</ons-list-item>
我有一个错误：
未登录错误:NavigatorView的页面堆栈为空
你能帮帮我吗?谢谢!
浏览 3提问于2015-04-13得票数 2
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
