微信小程序，循环遍历view模块,根据view的值的不同，点击view模块，跳转到不同的页面

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了微信小程序，循环遍历view模块,根据view的值的不同，点击view模块，跳转到不同的页面，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含1079字，纯文字阅读大概需要2分钟。

内容图文

前端页面效果如下：

 WXML代码

<!-- 铜陵力凡公司 -->
<view class='head'>
{{mess}}
</view>
<!-- 图片模块 -->
<view>
<image src="/images/logo.jpg" class='img'></image >
</view>
<!-- 循环遍历模块 -->
<view class='center'>
<view class="part"  wx:for-items="{{list}}" bindtap="dispath" wx:for-index="index" data-text="{{item}}">
{{item}}
</view>
</view>
<view>
</view>
<view wx:if="{{flag?true:false}}" class="version">
{{versioninfo}}
</view>

  

---

 js代码

Page({

  /**
   * 页面的初始数据
   */
  data: {
    mess:'铜陵力凡有限公司',
    list: ["我发布的项目", "友情咨询", "支持服务类型","更多"],
    flag:false,
    versioninfo:"小程序开发者-田江南",
  },
  //点击不同的模块，根据模块里面的内容跳转到不同的页面
  dispath:function(e){
    //e.currentTarget.dataset.text获取点击的模块的值
    if ("友情咨询"==e.currentTarget.dataset.text){
      wx.navigateTo({
       url: './page',
      })
    }
    if ("我发布的项目" == e.currentTarget.dataset.text) {
      wx.navigateTo({
        url: '../publish/index',
      })
    }

    if ("支持服务类型" == e.currentTarget.dataset.text) {
      wx.navigateTo({
        url: './service',
      })
    }  
    if ("更多" == e.currentTarget.dataset.text) {
      wx.navigateTo({
        url: './more',
      })
    } 
  },
})

---

效果如下

内容总结

以上是互联网集市为您收集整理的微信小程序，循环遍历view模块,根据view的值的不同，点击view模块，跳转到不同的页面全部内容，希望文章能够帮你解决微信小程序，循环遍历view模块,根据view的值的不同，点击view模块，跳转到不同的页面所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

---