美文网首页
微信小程序-页面跳转

微信小程序-页面跳转

作者: 喂_balabala | 来源:发表于2024-07-11 14:40 被阅读0次

navigateTo

Page({
  data: {
    username: '',
    password: ''
  },
  onInputChange: function(event) {
    const { type } = event.currentTarget.dataset;
    this.setData({
      [type]: event.detail.value
    });
  },
  onLogin: function() {
    // 模拟登录验证,这里应调用微信的登录接口或其他后端接口
    if (this.data.username === 'admin' && this.data.password === '123456') {
      wx.navigateTo({
        url: '../pageB/pageB',
      });
    } else {
      wx.showToast({
        title: '登录失败',
        icon: 'none'
      });
    }
  }
});

取消当前界面左上角的返回按钮

  • 在目标页面的 JSON 配置文件中设置 navigationStyle 为 "custom",这会自定义导航栏,从而移除返回按钮。
{
  "navigationBarTitleText": "Detail Page",
  "navigationStyle": "custom"
}

禁止返回上一个界面

要实现取消左上角的返回按钮并限制系统返回键返回到上一个界面,可以使用wx.redirectTo跳转方式或wx.reLaunch跳转方式来代替wx.navigateTo

  • wx.redirectTo会关闭当前页面,跳转到应用内的某个页面,跳转后将无法通过左上角返回按钮返回到上一个页面。示例代码如下:
// 在触发跳转的地方使用 wx.redirectTo
wx.redirectTo({
  url: '下一个页面的路径',
});
  • 或者使用wx.reLaunch,它会关闭所有页面,打开应用内的某个页面

相关文章

  • 小程序页面跳转解析

    对于两个或更多页面的微信小程序而言,页面之间的跳转是在所难免的。 有关小程序页面间跳转的 API 函数,微信一共为...

  • 微信小程序:服务通知跳转长链接

    问题: 在微信的服务通知里面跳转微信小程序页面,小程序页面链接需要带一个h5页面链接,跳转后显示页面不存在。 定位...

  • 微信小程序-页面跳转

    微信小程序-页面跳转 一、在app.json中配置跳转页面: logs为当前将要跳转到的页面 { “pages”:...

  • 微信小程序页面跳转方法总结

    微信小程序页面跳转目前有以下方法(不全面的欢迎补充): 1. 利用小程序提供的 API 跳转: // 保留当前页面...

  • 跳转大全

    微信小程序页面跳转目前有以下方法(不全面的欢迎补充): 1. 利用小程序提供的 API 跳转: //保留当前页面,...

  • APP跳转小程序,小程序跳转APP,看我就够了

    本文涉及的内容:APP跳转小程序,跳转指定页面,传参。APP分享小程序。小程序跳转APP,传参。默认已集成微信SD...

  • 微信小程序的跳转方式

    微信小程序有5种跳转方式 switchTab这种跳转只能跳转到 tabBar 配置的页面 navigateBack...

  • 微信小程序的周期解析

    微信小程序中的路由跳转方式(传参)通过navigateTo({})来进行页面的跳转 注意:保留当前页面,跳转到应用...

  • 2020-09-28

    微信小程序模仿微信主页及页面跳转详解 主页wxml代码:

  • 微信小程序学习点滴

    **微信小程序学习点滴**《一》:如何获取时间,页面跳转,传递参数 **微信小程序学习点滴**《二》:开发者工具快...

网友评论

      本文标题:微信小程序-页面跳转

      本文链接:https://www.haomeiwen.com/subject/hfrxhjtx.html