用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

微客吧 首页 教程 微信小程序 新手教程 查看内容

小程序开发使用weui无效解决方法,标签中传入多个数组型数据 ... ... .. ... ...

纸飞机 2018-3-6 16:11

一:公众号及开发使用weui无效解决方法分享者:lijie627239856,原文地址 在开发微信公众号过程中,对于不熟悉前端的童鞋们来说, 明明引用了css文件,可以就是没有实际效果,瞬间懵逼 其实这个是微信官方文档weui中的BU ...

一:公众号及开发使用weui无效解决方法

分享者:lijie627239856,

原文地址


在开发微信公众号过程中,对于不熟悉前端的童鞋们来说,
明明引用了css文件,可以就是没有实际效果,瞬间懵逼
其实这个是微信官方文档weui中的BUG,给出的类名全部是以下这种形式

  1. href="#" class="weui_btn weui_btn_mini weui_btn_default">按钮

实际上,应该是这样的!

  1. href="#" class="weui-btn weui-btn_mini weui-btn_default">按钮

注意:类名中的"-"和"_"这两个的位置

我总结了下,首先"weui"这部分的后边用的是"-";

而再后边如果还有内容的话就全部用"_"这个下划线了;
更多请见:

二:标签中传入多个数组型数据

分享者:zhenxue007,

原文地址


中用for循环传入多个成对不同数据时的实现方法。

效果如下:

遍历实现方法:wxss省略:

wxml中代码:

  1. class="navban" indicator-dots="{{indicatorDots}}" interval="{{interval}}" duration="{{duration}}">
  2. wx:for="{{navs}}">
  3. class="navbox">
  4. class="navimg" src="{{item.navimg}}">
  5. class="navtext">{{item.navtext}}

相对应js里面的代码:

  1. var app = getApp()
  2. Page({
  3. data: {
  4. navs:[
  5. { navimg:'/images/i01.png', navtext:'掌上信息'},
  6. { navimg:'/images/i02.png', navtext:'商家'},
  7. { navimg:'/images/i03.png', navtext:'抢购'},
  8. { navimg:'/images/i04.png', navtext:'抢福利'},
  9. { navimg:'/images/i05.png', navtext:'五折卡'},
  10. { navimg:'/images/i06.png', navtext:'黑猫活动'},
  11. { navimg:'/images/i07.png', navtext:'本地圈'},
  12. { navimg:'/images/i08.png', navtext:'顺风车'},
  13. ],
  14. indicatorDots: true,
  15. autoplay: true,
  16. interval: 2000,
  17. duration: 1000,
  18. }
  19. })

鲜花
鲜花
握手
握手
雷人
雷人
路过
路过
鸡蛋
鸡蛋
分享至 : QQ空间
收藏