下面是结构目录:
通过点击banner/index.mpx里的轮播图图片跳转详情页并且传一个id过去在详情页显示
app.mpx
<script name='json'>
module.exports = {
"packages": [
"./components/banner-detail/app.mpx?resolve"
]
}
</script>
banner/index.mpx
<template>
<view class="page-body">
<view class="swiper">
<swiper indicator-dots="{{indicatorDots}}"
autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" current="{{current}}" circular="{{circular}}" bindchange="swiperChange">
<block wx:for="{{bannerImage}}" wx:key="index" data-index={{index}}>
<navigator url="{{item.url}}" open-type="navigate">
<swiper-item bindtap="imgClick" data-url="{{item.url}}" data-id="{{item.id}}">
<image class="{{item.title}}" wx:if='{{item}}' src="{{item.image}}"></image>
</swiper-item>
</navigator>
</block>
</swiper>
</view>
</view>
</template>
<style>
</style>
<script>
import { createComponent } from '@mpxjs/core'
import banner1 from '../../../img/banner1.png'
import banner2 from '../../../img/banner2.png'
import banner3 from '../../../img/banner3.png'
createComponent({
data: {
bannerImage: [
{
"id": 1,
"image": banner1,
"title": "banner1",
"url": "https://www.baidu.com/"
},
{
"id": 2,
"image": banner2,
"title": "banner2",
"url": "https://fanyi.baidu.com/"
},
{
"id": 3,
"image": banner3,
"title": "banner3",
"url": "https://www.jianshu.com/"
}
],
indicatorDots: true,
vertical: false,
autoplay: true,
interval: 2000,
duration: 500,
circular: true,
current: 0
},
methods: {
swiperChange: function (event) {
let current = event.detail.current;
this.setData({
current
})
},
imgClick: function (e) {
console.log(121212, this.data.current);
console.log('跳转详情', e.currentTarget.dataset)
wx.navigateTo({
//在这里跳转详情页,并且传给详情页一个id
url: '../banner-detail/pages/index.mpx?id=' + e.currentTarget.dataset.id
})
}
}
})
</script>
<script name="json">
module.exports = {
'component': true
}
</script>
现在一点击轮播图上的图片就出现报错,每一张都是,都无法跳转更不用说是传参了,求大佬指教,在线急!!!!!
页面跳转都是最开头一个/就行,这个页面不是根据层级来算的是根据app里面编译的地址来的
<script>
import { createComponent } from '@mpxjs/core'
import bannerDetail from '../banner-detail/pages/index.mpx?resolve'
createComponent({
data: {
current: 0,
id: 0
},
methods: {
imgClick: function (e) {
this.setData({
id: e.currentTarget.dataset.id
}, () => {
wx.navigateTo({
url: bannerDetail + '?id=' + this.data.id
})
})
}
}
})
</script>
不应该是pages/xxx/xxx吗