E企盈营销工具技术服务商 热线:4006-838-530

微信小程武鸣县E企盈小程序序页面跳转、弹出框

一、页面跳转页面跳转是微信小程序中开通相册/照片书小程序电话:4006-838-530使用较为频繁并且很重要的功能之一,页面跳转一般是通过点击按钮或者文本区域后需要进行的操作。页面跳转中需要注意的点很多,我在这就介绍一些我在写项目过程中所遇到的一些情况里的跳转方式。1,一般情况一般情况下,在点击了按钮或文本之后,跳转到另一个页面。.wxml<button bindtap='bu'>setting</button><view bindtap='te'><text>hello</text></view>    

很简单,在wxml中只需添加 bindtap 属性,然后在 js 中增加相对应的函数。.jste(event){   wx.navigateTo({      开通园艺工具小程序电话:4006-838-530 url:'',   })},bu(event){   wx.navigateTo({       url:'',   })},

在函数中只需使用自带的 navigateTo 方法即可跳转到指定页面。url 中填写目标页面的路径。2,switchTab在写项目的过程中,我发现 navigateTo 并不能跳转到属于 tabBar 的目标页面。tabBar 又只能唯一存在在 app.json 中。这时就该  switchTab 上场了。switchTab 是专门为 tabBar 服务的页面跳转方法。.jsbu(event){  wx.switchTab({    url:''  })},

只需把 navigateTo 更改为 switchTab 即可。3,bindtap 和 catchtap写项目时经常会遇到多级点击事件,这时就需要明确区分 bindtap 和 catchtap 。进行页面跳转的按钮或文本有时也会遇到上级布局中也存在着点击事件的情况。.wxml<view bindtap='sum'>    <view><text>hello</text></view>    <button bindtap='bu'>setting</button></view>

这种情况常有发生,这时点击按钮就会发现 sum 函数又执行了一遍。而本意是只执行 bu 函数。这就是因为 bindtap 它会触发父级点击事件,catchtap 与 bindtap 完全不同。catchtap 不会触发父级点击事件,只触发当前的点击事件。.wxml <view bindtap='sum'>   <view><text>hello</text></view>   <button c开通物联网市场小程序电话:4006-838-530atchtap='bu'>setting</button></view>

将内部的 bindtap 改为 catchtap ,则不会触发父级 sum 点击事件。4,传值跳转页面跳转时,有时需要进行数据的传递,掌握这个技巧就非常重要了。传递.jswx.navigateTo({  url:'pages/my?name='+it+'&pass='+pa;})

url 中拼接上要传递的 id 以及对应的值接收时,在 onLoad 函数中直接接收接收onLoad: function (options) {      var name = options.name;     var pass = options.pass;  }

这样就完成了 数据 在页面中的 传递。二、弹出框1,showToast安卓中有 toast 弹出框,微信小程序中也有相对应的 showToast 方法。showToast 在项目实践中也是使用非常频繁的方法。.jswx.showToast({   title: '成功',    icon: 'success',      image:''   duration: 2000   //持续时间   mask:true //是否使用蒙层})

icon 目前只支持 success 和 loading 两种。但也可以添加图片来实现其它弹出内容。2,showLoadingshowLoading 方法专门用于显示 正在加载 的消息提示框。只有两个参数.jswx.showLoading({   title:'加载中',   mask:true})

showLoading() 的关闭必须要使用 hideLoading() 方法。3,Vant Weapp微信只提供以上两种弹出框,这很难满足很多小程序的需要,这里推荐一个UI组件库,里面有美观且功能强大的组件。有很多种美丽的弹出框,操作简单,适合小白,有需要的可以去看看。https://youzan.github.io/vant-weapp/#/intro微信小程序

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » 微信小程武鸣县E企盈小程序序页面跳转、弹出框
分享到: 更多 (0)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

模王系统开发

联系我们升级日志

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

支付宝扫一扫打赏

微信扫一扫打赏