老规矩,先看代码,想要点击这四个图片分别进入不同的页面。这就使用到小程序url,先看下代码:
<view class="adsenseBox">
<navigator class="adsense" url="{{item.urlLink}}" wx:for="{{adsenseList}}" data-id="{{item.id}}" catchtap="adsense" wx:key>
<image src="{{item.urlImg}}"></image>
</navigator>
</view>
adsenseList:[
{id:'01', urlLink:'details/index', urlImg:'http://demo.demohuo.top/modals/62/6201/demo/themes/img/ad/tou-6.jpg'},
{id:'02', urlLink:'details/index', urlImg:'http://demo.demohuo.top/modals/62/6201/demo/themes/img/ad/tou-5.jpg'},
{id:'03', urlLink:'details/index', urlImg:'http://demo.demohuo.top/modals/62/6201/demo/themes/img/ad/tou-4.jpg'},
{id:'04', urlLink:'details/index', urlImg:'http://demo.demohuo.top/modals/62/6201/demo/themes/img/ad/tou-3.jpg'}
],
点击按钮跳转到新的页面,也可以使用小程序路由:
wx.switchTab 跳转到tabBar页面,并关闭其他所有非tabBar页面
wx.reLaunch 关闭所有页面,打开到应用内的某个页面
wx.redirectTo 关闭当前页面,跳转到应用内的某个页面,但是不允许跳转到tabbar页面
wx.navigateTo 保留当前页面,跳转到应用内的某个页面,但是不能跳转tabbar页面。
wx.navigateBack 关闭当前页面,返回上一页面或多级页面。
<navigator target="miniProgram" open-type="navigate" app-id="" path="" extra-data="" version="release" class="nav"></navigator>
// 跳转到新的小程序