加入购物车的时候,往往会有产品相关属性的选择,比如:尺寸,规格等.像我做的项目中,就有一个门店的选择,如下图: 我们如何做到当前点击的这个高亮呢?今天就讲一下如何实现这个功能. 思路: 1.定义一个高亮的样式,我就命名为active了: 2.获取你点击的这个id或者其他的唯一属性,我这里的唯一属性是campusId; 3.通过判断你点击的这个元素的campusId 是不是 等于 它自身的campusId,如果等于就添加active的样式. 相关代码: wxml: <view class='row…

书接上文哈 咱们定义了个状态管理对象 逻辑应该是这样的 if (json.product.activity.type == "Coin1") { this.activity.coin1Show = now > json.product.activity.preAt && now < json.product.activity.postAt } if (this.activity.coin1Show) { this.activity.unStart = now…

其实这个标题 不是很对 主要是最近小程序项目中 有这么一个状态 所有商品都共用一个商品详情页面  大概就是这样子  为了公司 保险起见,一些展示的内容已经处理 但是无伤大雅 就是这么两个按钮 左侧粉色的为商城活动价格,右侧为活动价格 那么说什么时候展示什么样子的按钮啊呢? 首先的思路为判断该商品是否属于我们做的活动中的商品,如果是我们活动中的商品,那么右侧的按钮是要出现的,若右侧按钮出现,那么左侧按钮则想图片中展示一样出现 若改商品不是属于参与活动的商品那么右侧按钮是不出现的 左侧按钮则是平铺…

微信小程序中,数据状态不同页面中不能跨页面同步更新,也就是缺失类似vuex,mobx,redux全局的数据状态管理功能. 有些人移植了这些库,但是毕竟不是微信小程序生态的东西. Tencent也发布了类似的库,叫做 westore,基于小程序开发,非常小巧好用,非常推荐. 但是由于重写了Page方法,而现在很多项目都有自己的框架(已经重写了Page方法等),重构代价较大, 所以参考实现了 wxscv. 设计思路 想像model一样引入单独的数据模块,引入相同model的页面数据更新是同步的. 页…

底部导航栏这个功能是非常常见的一个功能,基本上一个完成的app,都会存在一个导航栏,那么微信小程序的导航栏该怎么实现呢?经过无数的踩坑,终于实现了,好了,先看看效果图. 对于底部导航栏,小程序上给出的文档要求里面的item最少2个,最多五个. 好了,先看看代码: 在项目中找到这个文件 1 { 2 "pages":[ 3 "pages/index/index", 4 "pages/logs/logs", 5 "pages/mine/min…

在做微信小程序换皮肤的时候,需要动态修改菜单栏(TabBar)和导航栏(NavigationBar) 但是在小程序中它们的样式是写在app.json里面,而且app.json是静态编译,运行时哪怕你修改了里面的值,也是不起做作用的. 不过官方提供了动态修改两个样式的api. 动态修改NavigationBar wx.setNavigationBarColor({ frontColor:"#ffffff", backgroundColor:'#000000' }); 动态修改TabBar…

我们知道,WEB服务器通过浏览器携带的cookie获取session来判断是否是同一用户(或浏览器):Restful服务通过客户端传过来唯一ID,来识别调用用户. >为什么需要维护登录态? 有自身用户体系的应用 用户敏感数据,只对用户可见 涉及用户相关的业务,比如我的订单.个性化推荐等 >小程序登录态维护实现流程 通过wx.login获取登录态. 通过登录返回的code发送给服务器,服务器用code换取session_key和openid后. 获取session_key后一般使用缓存框架保存登…

1.data里定义切换图片的地址和切换的标识 data:{ show:true, yes:"http://101.89.144.168:9090//files/jk/yd/images/index/banner-3.jpg", no:"http://101.89.144.168:9090//files/jk/yd/images/index/banner-1.jpg" }, 2.组件里使用三元表达式 <image src="{{show?yes:no}…

一.功能描述 在同一个页面内实现不同展示页面的切换功能,如下图所示 二.代码实现 1. index.js Page({ /** * 页面的初始数据 */ data: { currentData : 0, }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { }, //获取当前滑块的index bindchange:function(e){ const that = this; that.setData({ currentData: e.d…

未开考 .已交卷. 考试中 .考试结束 #ddd      #f00     #ff0    默认禁用色 禁用的button仅有style起作用,四个状态,通过wx:if ... elif ... elif ... else 来进行判断并且显示(仅能展示一个状态).…