本文实例为大家分享了微信小程序实现简易表格的具体代码，供大家参考，具体内容如下 由于需要开发小程序，前端又是自己弄，类似table的标签也没有，后来看到小程序文档中推荐使用flex布局，就把css中的flex布局学了一遍，效果还行，大家将就看一下 table.wxml <view class="table"><view class="tr bg-w"><view class="th">head1</view><view class="th">head2</view><view class="th ">head3</view></view><block wx:for="{{listD...
大家都知道微信小程序自身没有提供表格这个组件，但是今天的项目需求又出现了，所以只能模仿一个了。 效果图：代码挺简单方便的： wxml:<view class=history-table-wrap><view class="table"><view class="tr"><view class="th th1">日期</view><view class="th th2">时间</view><view class="th th3">伤害</view></view><view class="tr" wx:for="{{15}}"><view class="td td1">2018/02/12</view><view class="td td2">11:30</vie...
这里展示一个工作中用到的微信小程序的单选选项卡切换效果的制作方法，供大家参考，具体内容如下 效果如图：wxml: <view class="item" wx:for="{{data}}" wx:for-item="item" wx:for-index="idx" data-idx="{{idx}}" bindtap="chooseItem"><view class="choosebtn {{idx==currentidx&&choose==true?choosedbtn:choosenobtn}}"></view><text>{{idx==currentidx&&choose==true?text:textTwo}}</text> </view>wxss: .item {width: 100...
本文实例为大家分享了微信小程序实现左右列表联动的具体代码，供大家参考，具体内容如下 效果图：直接上代码： wxml界面: <view class=header> <text class=headerClass>分类</text> <text class=headerPin>/品牌</text> <view class="search"><image src=/images/搜索.png></image> <text>搜索商品</text> </view> </view> <view class=main><view class=left><scroll-view scroll-y="true" style="height: 1100rpx" scroll-i...
本文实例为大家分享了微信小程序实现联动选择器的具体代码，供大家参考，具体内容如下 picker 从底部弹起的滚动选择器，现支持五种选择器，通过mode来区分，分别是普通选择器，多列选择器，时间选择器，日期选择器，省市区选择器，默认是普通选择器。 先来看看效果图：1、普通选择器 mode = selector（默认的） <view class=picker>普通选择器</view><!--value: value值表示选择了让的第几个，index===下标 从0开始rang：对应数据b...
本文实例为大家分享了微信小程序实现按钮颜色状态转换的具体代码，供大家参考，具体内容如下 效果图片： index.wmxl文件<block wx:for="{{pres}}"><view class=foot_tab data-id="{{index}}" style="{{index==id? color:rgb(91, 207, 97):color:#ddd}}" bindtap=changeColor><view class="icon"><icon class="iconfont {{item.img_type}}"></icon></view><view>{{item.text}}</view></view></block>index.js文件 var id; Page({dat...
本文实例为大家分享了微信小程序实现级联菜单的具体代码，供大家参考，具体内容如下 <view ><picker bindchange="bindPickerChange0" value="{{brandindex}}" range="{{brands}}"><view class="picker">品牌：{{brands[brandindex]}}</view></picker> </view><view ><picker bindchange="bindPickerChange1" value="{{index1}}" range="{{object}}"><view class="picker">配件类别：{{object[index1]}}</view></picker> </view> da...
本文实例为大家分享了微信小程序实现购物页面左右联动的具体代码，供大家参考，具体内容如下 效果图：wxml <view class="pro-container"><scroll-view class="left-menu" scroll-y scroll-with-animation="true" scroll-top="{{leftMenuTop}}"><view class="menu-item {{index===currentActiveIndex?menu-active:}}" wx:for="{{item}}" wx:key="{{item.index}}" id="{{index}}" catchtap=changeMenu >{{item.typename}}</view></sc...
本文实例为大家分享了微信小程序实现商品属性联动选择的具体代码，供大家参考，具体内容如下 效果演示：代码示例 1、commodity.xml<!-- <view class="title">属性值联动选择</view> --> <!--options--> <view class="commodity_attr_list"> <!--每组属性--><view class="attr_box" wx:for="{{attrValueList}}" wx:for-item="attrValueObj" wx:for-index="attrIndex"> <!--属性名--><view class="attr_name">{{attrValueObj.attrKe...
本文实例为大家分享了微信小程序时间标签和时间范围联动的具体代码，供大家参考，具体内容如下最近忙于一个有关数据管理的微信小程序，遇到了上图情况，虽然很简单，还是整理一下。若有错误，请广大朋友们指正。 使用微信小程序组件radio-group、picker，用wxss对radio按照需求进行重构，picker里边的start和end时间是根据radio来显示的。将start、end时间放在data里，radio发生改变时，改变data中的时间。当picker中的值发生改变时...
本文实例讲述了微信小程序实现的自定义分享功能。分享给大家供大家参考，具体如下： 大家都知道，小程序有分享的功能，可以分享整个程序，也可以自定义分享的内容 onShareAppMessage 在 Page 中定义 onShareAppMessage 函数，设置该页面的分享信息。 只有定义了此事件处理函数，右上角菜单才会显示“分享”按钮用户点击分享按钮的时候会调用此事件需要 return 一个 Object，用于自定义分享内容示例代码： Page({onShareAppMessage:...
本文实例为大家分享了微信小程序实现展示评分结果的具体代码，供大家参考，具体内容如下 星星评分展示1根据评分展示整颗行星或者半颗星星 星星评分展示2根据评分按照小数点展示整颗行星或者部分星星 wxml <view class="conmmentbox"><view class="starbox"><view class="stars2" style="width: 130rpx"> <view><image src="../../image/token_img/lp_ct2.png"></image><image src="../../image/token_img/lp_ct2.png"></image><ima...
本文实例为大家分享了微信小程序工作时间段选择的具体代码，供大家参考，具体内容如下1. 效果图如上，需完成时间段的选择 以及下面的工作日选择 保存按钮为formSubmit提交后台 2.思路： ①时段用picker跟input 如果没有占位字符 则不需要input ②工作日选择用checkbox 多选的样式用label 将checkbox隐藏 ③label的选择后的样式跟取消的样式，这里无需判断checked 当然也可以判断checked 我这里的方法是，先建一个放星期一到...
昨天弄一个微信倒计时;遇到了这个为题，调试了才找到问题的所在，然后在网上找了资料才知道这个问题的原因，来是因为IOS系统不支持2018-08-30这样的格式的时间导致的 let olddata =2018-08-30 11:00:00; let mydata=new Date(olddata); console.log(mydata); let newdata=mydata.getTime();这样的代码安卓手机开发手机和微信小程序编辑器测试都没有问题，唯独IOS获取的日期为不显示,原来IOS只识别2018-08-30这样的日期格式 下面用正...
在开发微信小程序时，有一个消息推送，它的解释是这样的。 消息推送具体的内容是下面的这个网址 https://developers.weixin.qq.com/miniprogram/dev/framework/server-ability/message-push.html，他介绍的也还可以，就是我这里换成了node代码。 消息推送 启用并设置消息推送配置后，用户发给小程序的消息以及开发者需要的事件推送，都将被微信转发至该服务器地址中。 在微信小程序的首页开发里面，开发设置中，微信的官网中，介...