微信小程序页面跳转

来源:互联网 发布:3d图形编程 编辑:程序博客网 时间:2024/05/17 00:16

微信小程序页面跳转

今天刚开始研究微信小程序,就遇到了不知道怎么跳转的问题,百度了一大堆,这里还是把我自己摸索的跟大家分享一下:

            <!--index.wxml-->            <view  class="userinfo">            <text class="userinfo-nickname" bindtap="enter">点击进入</text>           </view> 

这是wxml里面的代码,相当于网页里面的html,实现一个点击文字进入另一个页面的功能:

        //index.js         // 页面跳转          enter:function(){            wx.navigateTo({              url: '../index/page'            })              }

这是js文件中的代码,这里注意,URL的参数主目录由两个点代替,写出来的话方法执行不了,暂时我也不知道为什么,可能是代码规范吧,最后一步,假如创建名为page的新页面,一定要在app.json里面配置一下:

         "pages":[            "pages/index/index",            "pages/logs/logs",            "pages/index/page"       ],

这里注意一下,如果要在下面加页面给上面最后一个页面要加逗号。

还有一种跳转,前提是页面注册过了,这种比较简单在官方文档里面看到的:

 <view class="btn-area">  <navigator url="/page/navigate/navigate?title=navigate" hover-class="navigator-hover">跳转到新页面</navigator>  <navigator url="../../redirect/redirect/redirect?title=redirect" open-type="redirect" hover-class="other-navigator-hover">在当前页打开</navigator>  <navigator url="/page/index/index" open-type="switchTab" hover-class="other-navigator-hover">切换 Tab</navigator></view>

这种的话就比较简单一点了。