您现在的位置是:网站首页> 小程序设计

uniapp页面

摘要

getApp()

getApp() 函数用于获取当前应用实例,一般用于获取globalData 。

实例

const app = getApp()console.log(app.globalData)

注意:

  • 不要在定义于 App() 内的函数中,或调用 App 前调用 getApp() ,可以通过 this.$scope 获取对应的app实例
  • 通过 getApp() 获取实例之后,不要私自调用生命周期函数。
  • v3模式加速了首页nvue的启动速度,当在首页nvue中使用getApp()不一定可以获取真正的App对象。对此v3版本提供了const app = getApp({allowDefault: true})用来获取原始的App对象,可以用来在首页对globalData等初始化

getCurrentPages()

getCurrentPages() 函数用于获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面。

注意: getCurrentPages()仅用于展示页面栈的情况,请勿修改页面栈,以免造成页面状态错误。

每个页面实例的方法属性列表:

方法描述平台说明
page.$getAppWebview()获取当前页面的webview对象实例App
page.route获取当前页面的路由

Tips:

  • navigateToredirectTo 只能打开非 tabBar 页面。
  • switchTab 只能打开 tabBar 页面。
  • reLaunch 可以打开任意页面。
  • 页面底部的 tabBar 由页面决定,即只要是定义为 tabBar 的页面,底部都有 tabBar
  • 不能在 App.vue 里面进行页面跳转。

$getAppWebview()

uni-app 在 getCurrentPages()获得的页面里内置了一个方法 $getAppWebview() 可以得到当前webview的对象实例,从而实现对 webview 更强大的控制。在 html5Plus 中,plus.webview具有强大的控制能力,可参考:WebviewObject

uni-app框架有自己的窗口管理机制,请不要自己创建和销毁webview,如有需求覆盖子窗体上去,请使用原生子窗体subNvue

注意:此方法仅 App 支持

示例:

获取当前页面 webview 的对象实例

export default {  data() {    return {      title: 'Hello'    }  },  onLoad() {    // #ifdef APP-PLUS    const currentWebview = this.$scope.$getAppWebview(); //此对象相当于html5plus里的plus.webview.currentWebview()。在uni-app里vue页面直接使用plus.webview.currentWebview()无效,非v3编译模式使用this.$mp.page.$getAppWebview()    currentWebview.setBounce({position:{top:'100px'},changeoffset:{top:'0px'}}); //动态重设bounce效果    // #endif  }}

获取指定页面 webview 的对象实例

getCurrentPages()可以得到所有页面对象,然后根据数组,可以取指定的页面webview对象

var pages = getCurrentPages();var page = pages[pages.length - 1];// #ifdef APP-PLUSvar currentWebview = page.$getAppWebview();console.log(currentWebview.id);//获得当前webview的idconsole.log(currentWebview.isVisible());//查询当前webview是否可见);// #endif

uni-app自带的web-view组件,是页面中新插入的一个子webview。获取该对象的方法见:https://ask.dcloud.net.cn/article/35036


上一篇:uniapp编译相关

下一篇:uniapp页面通讯

Top