小程序 创建数组
#多维数组创建
let app_info =[
{appid:info[appid],path:info[path],extend_data:info[extend_data]}
]
#一维数组创建
let app_info ={appid:info[appid],path:info[path],extend_data:info[extend_data]}
#多维数组创建
let app_info =[
{appid:info[appid],path:info[path],extend_data:info[extend_data]}
]
#一维数组创建
let app_info ={appid:info[appid],path:info[path],extend_data:info[extend_data]}
swipclick:function(event){
console.log(event)
let item_url =event.currentTarget.dataset.url // 页面跳转地址
console.log(item_url)
let tolink = '../../pages/h5view?url='+encodeURIComponent(item_url);
if(item_url){
//先提示后跳转
wx.showModal({
title: '跳转提示',
content: '您即将离开XXX,请注意您的账号和财产安全!',
confirmColor: "#1aad19",
success: function (sm) {
if(sm.confirm){
wx.navigateTo({
url: tolink,
})
}
}
})
}
console.log('嘿嘿')
},
一、先解决焦点图的点击事件
wxml部分
<swiper indicator-dots='true'
indicator-active-color='#ff5777'
autoplay='true'
circular='true'
interval='5000'
class='swiper'>
<block wx:for="{{bannerList}}" wx:key="index">
<swiper-item>
<image class="swiper-image" src="{{item.img_url}}" data-id="{{item.img_id}}" data-url="{{item.img_path}}" bindtap="swipclick" mode='scaleToFill'/>
</swiper-item>
</block>
</swiper>
js部分
swipclick:function(event){
console.log(event)
let item_url =event.currentTarget.dataset.url // 页面跳转地址
let tolink = '../../pages/h5view?url='+encodeURIComponent(item_url);
wx.navigateTo({
url: tolink,
})
console.log('嘿嘿')
},
二、制作一个空白page承载URL的加载内容
我这里在page/h5view创建了一个page
h5view.js在
/**
onLoad: function (options) {
let now_url =decodeURIComponent(options.url);
//获取url内容
url:now_url ,
this.setData({
url: now_url,
})
},
这里接收从navigateTo过来的参数
然后渲染到wxml里
<view class="container">
<view class="pageH5">
<web-view src="{{url}}"></web-view>
</view>
</view>
wxml代码
<view class="notice">
<view class="title">公告:</view>
<swiper class="swiper_container" vertical="true" autoplay="true" circular="true" interval="2000">
<block wx:for="{{msgList}}" wx:key="{{item}}">
<navigator url="/pages/index/index?title={{item.url}}" open-type="navigate">
<swiper-item>
<view class="swiper_item">{{item.title}}</view>
</swiper-item>
</navigator>
</block>
</swiper>
</view>
数据js
msgList: [
{ url: "url", title: "多地首套房贷利率上浮 热点城市渐迎零折扣时代" },
{ url: "url", title: "悦如公寓三周年生日趴邀你免费吃喝欢唱城市渐迎零折扣时代" },
{ url: "url", title: "你想和一群有志青年一起过生日嘛?" }],
wxss样式
.notice {
width: 750rpx;
position: relative;
margin-top:12rpx;
}
.notice .title{
width: 151rpx;
float: left;
text-align: center;
font-size: 30rpx;
line-height:55rpx;
}
.notice .swiper_container {
height: 55rpx;
width: 600rpx;
line-height:55rpx;
float: right;
}