您的位置:

Uniapp中关闭当前页面的多种方式

一、uniapp关闭当前页面跳转

在uniapp中,我们可以使用uni.navigateTo()方法实现关闭当前页面并打开新的页面。这种方法可以实现页面之间的跳转。

uni.navigateTo({
  url: '/pages/index/index'
});

以上的代码会关闭当前页面并跳转到pages文件夹下的index页面。

二、uniapp关闭页面进入新页面

如果需要关闭当前页面并进入新的页面,我们可以使用uni.redirectTo()方法。

uni.redirectTo({
  url: '/pages/index/index'
});

以上的代码会关闭当前页面并进入pages文件夹下的index页面。

三、uniapp关闭当前页面,打开新

如果我们需要在关闭当前页面后打开新的页面,我们可以使用uni.reLaunch()方法。

uni.reLaunch({
  url: '/pages/index/index'
});

以上的代码会关闭所有页面再打开pages文件夹下的index页面。

四、layui关闭当前页面

uniapp可以使用uni.navigateBack()方法实现关闭当前页面。但是如果需要在uniapp中使用layui来关闭当前页面,我们可以使用parent.layer.closeAll()方法实现。

parent.layer.closeAll();

以上的代码会关闭当前的layui窗口。

五、uniapp关闭页面回弹

如果需要在关闭当前页面的同时回传一些数据,我们可以使用uni.navigateBack()方法并传入一个参数。

//关闭当前页面并回传数据
uni.navigateBack({
  delta: 1,
  success: function() {
    uni.$emit('refresh');
  }
})

以上的代码会关闭当前页面并回传数据,并通过uni.$emit()方法触发refresh事件。

六、uniapp关闭指定的页面

如果需要关闭指定的页面,我们可以先使用uni.getCurrentPages()方法获取当前所有的页面,然后使用page对象的route属性匹配需要关闭的页面,最后调用page对象的方法关闭页面。

var pages = getCurrentPages();
for (var i = 0; i < pages.length; i++) {
  if (pages[i].route == "pages/index/index") {
    var page = pages[i]; //获取需要关闭的页面
    break;
  }
}
page.onUnload();

以上的代码会关闭pages文件夹下的index页面。

七、uniapp获取当前页面

如果需要获取当前的页面对象,我们可以先使用uni.getCurrentPages()方法获取当前所有的页面,然后使用数组的pop()方法获取最后一个页面,即为当前页面对象。

//获取当前的页面对象
var pages = getCurrentPages();
var currentPage = pages[pages.length - 1];

以上的代码会获取当前的页面对象。

八、uniapp关闭页面丢失缓存

如果需要在关闭页面的同时清空缓存,我们可以使用uni.clearStorage()方法。

//清空缓存并关闭当前页面
uni.clearStorage({
  success: function() {
    uni.navigateBack({
      delta: 1
    })
  }
})

以上的代码会成功清空缓存并关闭当前页面。

九、uniapp页面关闭的事件

如果需要在页面关闭时触发一些事件,我们可以使用onUnload()方法来监听页面关闭事件。

methods: {
  onUnload: function() {
    uni.$emit('close');
  }
}

以上的代码会在页面关闭时触发uni.$emit()方法,发送close事件。

十、uniapp取消启动页选取

如果我们需要在uniapp启动时取消启动页选取,我们可以在manifest.json文件中配置

"app": {
  "launch_path": "/pages/index/index",
  "subpackages": [],
  "globalStyle": {
    "navigationBarTextStyle": "black",
    "navigationBarTitleText": "WeChat",
    "navigationBarBackgroundColor": "#F8F8F8",
    "backgroundColor": "#F8F8F8"
  },
  "pages": [
    {
      "path": "pages/index/index",
      "style": {}
    }
  ],
  "tabBar": {}
}, 
"page": {
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "xxx",
    "navigationBarTextStyle": "black"
  },
  "permission": {
    "scope.userLocation": {
      "desc": "获取当前位置"
    }
  },
  "noPromiseAPI": [
    "createSelectorQuery"
  ],
  "preloadRule": {
    "pagePath": "/pages/index/index",
    "network": "all",
    "packages": []
  },
  "window": {
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "xxx",
    "navigationBarTextStyle": "black"
  },
  "networkTimeout": {
    "request": 10000,
    "downloadFile": 10000
  },
  "tabBar": {
    "backgroundColor": "#fafafa",
    "borderStyle": "white",
    "color": "#808080",
    "selectedColor": "#1296db",
    "list": [
      {
        "pagePath": "pages/index/index",
        "iconPath": "static/img/home.png",
        "selectedIconPath": "static/img/home-active.png",
        "text": "首页",
        "badge": {
          "type": "none",
          "text": ""
        }
      }
    ]
  },
  "debug": true,
  "resizable": true,
  "subPackages": []
}

以上的代码会取消启动页选取。