微信小程序开发学习笔记——2.11navigator页面链接导航

这篇具有很好参考价值的文章主要介绍了微信小程序开发学习笔记——2.11navigator页面链接导航。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

>>跟着b站up主“咸虾米_”学习微信小程序开发中,把学习记录存到这方便后续查找。

课程连接: https://www.bilibili.com/video/BV19G4y1K74d?p=14

一、navigator页面链接

https://developers.weixin.qq.com/miniprogram/dev/component/navigator.html

属性之一 

微信小程序开发学习笔记——2.11navigator页面链接导航,小程序开发学习笔记,微信小程序,学习,笔记

        navigate可以记录上一个缓存页,点击左上角返回按钮可以跳转回上一个页面,但是redirect不行。共同点是两者都不能跳转到tabbar页面(导航菜单这个东西还没配置,之后的课上再讲)。

        reLaunch和redirect很像,都不能跳转回上一个页面,区别在于reLaunch可以跳转到任何指定页面包括tabbar但redirect不能跳到tabbar。

二、例子

demo.wxml文件中添加以下代码

<navigator url="/pages/index/index">首页</navigator>
<navigator url="/pages/logs/logs" class="out">
  <image src="/static/image/gif1.gif" class="gif" mode=""/>
</navigator>

demo.wxss文件中添加以下代码

.out .gif{
  width: 200rpx;
  height: 200rpx;
}

index.wxml

<navigator url="/pages/demo/demo" open-type="redirect"><!--redirect使跳转到下一个页面后不会出现后退一步的按钮(左上角)-->
  go demo page
</navigator>

点击go demo page 

微信小程序开发学习笔记——2.11navigator页面链接导航,小程序开发学习笔记,微信小程序,学习,笔记

跳转到测试页面左上角没有返回键,因为open-type设置了redirect。

微信小程序开发学习笔记——2.11navigator页面链接导航,小程序开发学习笔记,微信小程序,学习,笔记

点击gif图片跳转到日志,左上角有返回键。

微信小程序开发学习笔记——2.11navigator页面链接导航,小程序开发学习笔记,微信小程序,学习,笔记文章来源地址https://www.toymoban.com/news/detail-836816.html

到了这里,关于微信小程序开发学习笔记——2.11navigator页面链接导航的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 微信小程序开发学习笔记——3.4for循环列表渲染的用法

    跟着b站up主“咸虾米_”学习微信小程序开发中,把学习记录存到这方便后续查找。 课程连接:https://www.bilibili.com/video/BV19G4y1K74d?p=18vd_source=9b149469177ab5fdc47515e14cf3cf74 https://developers.weixin.qq.com/miniprogram/dev/reference/wxml/list.html data.js文件的data部分:  data.wxml文件中添加如下代码:

    2024年02月22日
    浏览(59)
  • 微信小程序开发学习笔记《17》uni-app框架-tabBar

    博主正在学习微信小程序开发,希望记录自己学习过程同时与广大网友共同学习讨论。建议仔细阅读uni-app对应官方文档 运行如下的命令,基于master分支在本地创建tabBar子分支,用来开发和tabBar相关的功能: 在 pages目录中,创建首页(home)、分类(cate)、购物车(cart)、我的(my)这4个

    2024年02月20日
    浏览(69)
  • 微信小程序开发---页面导航

    目录 一、页面导航的概念 二、页面导航的实现 (1)声明式导航 1、概念 2、导航到tabBar页面 3、导航非tabBar页面 4、后退导航 (2)编程式导航 1、导航到tabBar页面 2、导航到非tabBar页面 3、后退导航 三、导航传参 (1)声明式导航传参 (2)编程式导航传参 (3)在onLoad中接收

    2024年02月09日
    浏览(45)
  • 微信小程序开发之页面传参

    这 传参主要是三种: 1.简单值传参如:id=1,string = asdfg之类,其中字符不包含特殊字符如?、=之类 2.含特殊字符传参如一个地址http://r.photo.store.qq.com/psb?/V10VqIG41I6D36/r5rQV.oz3tu1uuNvJjkDIzwhKi6nUfZaaLEH9UnNUCk!/r/dBkBAAAAAAAA 3.对象类型传参如一个数组,image【】。 第一种的话比较简单比如

    2024年02月09日
    浏览(37)
  • 微信小程序开发---小程序的页面配置

    目录 一、小程序页面配置的作用 二、页面配置和全局配置的关系 三、页面配置中常用的配置项 在每个小程序中,每个页面都有自己的.json配置文件,用来对当前页面的窗口外观,页面效果进行配置。 小程序中,app.json中的windows节点,可以全局配置小程序中每个页面的窗口表

    2024年02月09日
    浏览(47)
  • 微信小程序开发实战11_1 微信支付下单

    微信支付存在多个业务流程,包括微信支付流程、退款流程等。本章节主要介绍微信的支付下单流程,图12-1是微信支付流程的交互图: 重点环节说明 步骤1:小程序端用户向商户服务器发起支付请求,重点是提供用户信息、商品信息、支付金额等参数。 步骤3:商户服务器调

    2024年02月09日
    浏览(44)
  • 微信小程序开发教学系列(3)- 页面设计与布局

    在微信小程序开发中,页面的设计和布局是非常重要的。一个好的页面设计可以提升用户体验,并使小程序更加吸引人。本章节将介绍如何设计和布局微信小程序的页面。 3.1 页面结构和样式的创建和设置 在创建微信小程序页面时,需要先定义页面的结构和样式。可以通过以

    2024年02月11日
    浏览(43)
  • 微信小程序开发教学系列(9)- 小程序页面优化

    在开发小程序时,页面性能优化是非常重要的一项任务。优化页面性能可以提升用户体验,使小程序更加流畅和高效。本章将介绍一些常见的页面优化方法和技巧,帮助您提升小程序的性能。 页面性能优化的目标是减少页面加载时间和提升页面渲染速度,从而提供更好的用户

    2024年02月11日
    浏览(45)
  • 微信小程序开发实战11_4 微信支付退款流程

    当交易发生之后一年内,由于买家或者卖家的原因需要退款时,卖家可以通过退款接口将支付金额退还给买家,微信支付将收到退款请求并且验证成功之后,将支付款按原路退还至买家账号上。使用该接口时的一些注意事项如下: 交易时间超过一年的订单无法提交退款。 微

    2024年02月11日
    浏览(40)
  • 微信小程序开发实战9_2 小程序页面转发

    小程序页面转发是小程序分享的一个重要方式,在设计小程序应用时就需要考虑那些页面需要实现转发功能,以及页面的转发参数。本节介绍如何进行小程序页面的分享,并介绍如何获取小程序卡片的分享票据。 9.2.1小程序页面转发 微信小程序提供了页面的转发的功能,用户

    2024年02月16日
    浏览(43)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包