微信小程序日历效果
本文实例为大家分享了微信小程序日历效果的具体代码，供大家参考，具体内容如下源码下载地址项目需要一个日历功能，花了一天时间实现的微信小程序日历,js大小只有几k,引入了bootstrap字体图标(文件icon.wxss,该字体已经bootstrap字体图标需要的字体)看起来有80k,出去icon.wxss整个只有几k，有问题欢迎指...
2024-01-10
微信小程序选择图片控件
本文实例为大家分享了微信小程序选择图片控件的具体代码，供大家参考，具体内容如下xml:<loading hidden="{{loadingHidden}}"> 加载中...</loading><view class="add_carimg"> <block> <view class="load_iamge"> <text class="load_head_text">上传施工车辆照片</text> <text class="load_foot_text">{{imgbox.length}}/2</text>...
2024-01-10微信小程序实现点击效果
微信小程序动画之点击效果的具体代码，供大家参考，具体内容如下代码：js：// pages/test/test.jsPage({ containerTap: function (res) { var that = this var x = res.touches[0].pageX; var y = res.touches[0].pageY + 85; this.setData({ rippleStyle: '' }); setTimeout(function () { that.setDa...
2024-01-10微信小程序实现吸顶效果
最开始的时候，在小程序中实现吸顶效果，开发工具看起来还挺好的，但是在真机上就会有问题了。 原因是我不停的去 setData 会导致操作反馈延迟严重，无法及时将操作处理结果及时传递到视图层。后面就对代码进行了调整，避免不停的去setData效果图吸顶前吸顶后代码部分wxml<view style="width: 90...
2024-01-10微信小程序排坑指南详解
本文为大家分享了微信小程序排坑指南，供大家参考，具体内容如下no.1 背景图不显示微信小程序里面是允许用户自定义背景图的，但是限定了背景图的路径及地址，之前一直用相对路径来写，微信开发者工具中也显示出了背景图，误以为没有问题，但是预览的时候发现手机中不显示背景图，这就是...
2024-01-10微信小程序模版渲染详解
微信小程序的界面程序支持html语法，多加了一部分标签，如view、block、templete等。 模版渲染 index.wxml<view> <p>{{helloWord}}</p></view>其中{{}}里面包含的内容你可以理解为一个变量，怎么让程序解析出{{helloWord}}变量在index.js 中注册这个变量var json = { data:{ "helloWord" : "hello world" }};page(json)然后我...
2024-01-10微信小程序实现日历效果
本文实例为大家分享了微信小程序实现日历效果的具体代码，供大家参考，具体内容如下效果预览:wxml部分:<view class='box1' style='width: {{ sysW * 7 }}px'> <view class='dateBox'>{{ year }} - {{ month}}</view> <block wx:for='{{ weekArr }}'> <view style='width: {{ sysW }}px; height: {{ sysW }}px; line-height:...
2024-01-10微信小程序 参数传递详解
微信小程序的推出，无疑将会在移动互联网行业里再次掀起风浪。有人会质疑小程序会不会火， 会不会火我不知道， 看微信的用户量即可明白一切。微信小程序-参数传递这里我找到两种小程序上的参数传递方式，为了方便，我单独拿出来和大家分享下.一、通过事件进行参数传递先来看眼小程序...
2024-01-10
微信小程序计算器实例详解
微信小程序计算器实例，供大家参考，具体内容如下index.wxml<view class="content"> <view class="num">{{num}}</view> <view class="operotor">{{op}}</view></view><view class="entry"> <view> <view class="item" bindtap="resetBtn">c</view> <view class="item" bindtap...
2024-01-10微信小程序实现弹出层效果
本文实例为大家分享了微信小程序实现弹出层效果的具体代码，供大家参考，具体内容如下先看下效果图吧 其实这个效果实现起来很简单，就是通过三目运算符来控制遮罩层的显示和隐藏贴代码了：规则按钮：<text class='rule' bindtap='showRule'>规则</text>遮罩层：我这个数据是从后台拿来动态渲染到...
2024-01-10微信小程序动态增加按钮组件
这里的微信小程序动态加载是以按钮为例，主页面点击不同的按钮进入不同的子页面中，根据主页面的title来动态加载子页面按钮的数量以及值。效果图：wxml文件（注意wx:key="item"要写，不然它会有警告）：<!--pages/plan/plans/plans.wxml--><view class="className" style="background-color: rgb(225, 218, 211); height:{{className_...
2024-01-10微信小程序实现城市列表选择
本文实例为大家分享了小程序实现城市列表选择的具体代码，供大家参考，具体内容如下实现效果预览 实现功能简介城市的选择按中文/拼音/首字母条件搜索按首字字母快速定位到城市位置目录结构主要代码app.jsApp({ globalData: { trainBeginCity: '杭州', trainEndCity: '北京' }})app.json{ "pages":[ "p...
2024-01-10
微信小程序实现星星评分效果
本文实例为大家分享了微信小程序实现星星评分的具体代码，供大家参考，具体内容如下思路很简单，小星星都是一张张独立的图片，点击的时候改变图片的路径就可以了。我是用背景图片做的，先给盒子设置背景图片为灰色的小星星，盒子是根据js文件中的stars数组循环出来的，根据flag的值确定是...
2024-01-10微信小程序自定义联系人弹窗
微信小程序自定义类似微信联系人组件，供大家参考，具体内容如下在小程序项目中需要有一个选择人员项，想着看着好看一些，所以做成类似微信联系人的界面，由于本人是后端人员，效果不是特别好看，ui使用的是weui效果图如下：使用的是小程序自定义组件，自定义组件同样需要有js、wxss、json...
2024-01-10微信小程序 扎金花简单实例
微信小程序 扎金花实现效果图：app.json:{ "pages":[ "pages/index/index" ], "window":{ "navigationBarBackgroundColor": "#333333", "navigationBarTextStyle":"white", "navigationBarTitleText": "炸金花", "backgroundColor":"#ffffff", "backgroundTextStyle":"light", "enable...
2024-01-10微信小程序实现左侧滑动导航栏
本文实例为大家分享了微信小程序实现左侧滑动导航栏的具体代码，供大家参考，具体内容如下左侧滑动导航栏如图wxml<!-- 左侧滚动栏 --><view class='under_line'></view><view style='float: left' class='left'> <scroll-view scroll-y scroll-with-animation scroll-left="{{scrollLength}}" class='scrollY' style='height: {{winHeig...
2024-01-10微信小程序设置滚动条过程详解
原因原来在app.wxss中定义了如下的内容【不知道是不是新建项目自动生成的，这里也就提供了隐藏滚动条的思路啦】::-webkit-scrollbar { width: 0px; height: 0px; color:#transparent;}what, 宽高为0，而且还是透明的，难怪，好吧，修改宽高4px，color设置为green，以为可以了，呵呵，太年轻。scroll-viwe依然没有滚动...
2024-01-10
微信小程序实现单选选项卡切换
这里展示一个工作中用到的微信小程序的单选选项卡切换效果的制作方法，供大家参考，具体内容如下效果如图：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'}}"><...
2024-01-10
微信小程序 按钮的权限判断显隐
微信小程序怎么写权限判断 dom的显隐后台返回权限列表，前端需要判断某个按钮是否有权限，没有就隐藏之前vue都是使用自定义指令，传一个按钮的权限参数来判断微信小程序就不知道写了，不支持自定义指令，wx.if也无法使用方法回答：微信小程序的条件渲染<view wx:if="{{condition}}"> 展示 </view>//condition 为true时渲染 view<view hid...
2024-03-01微信小程序 五星评分的实现实例
微信小程序 五星评分五星级评分效果:<view> <view class="zan-font-16 my-ib" bindtap="myStarChoose"> <block wx:for="{{starMap}}"> <text wx:if="{{star>=index+1}}" style="padding-right: .5em" class="zan-c-red" data-star="{{index+1}}">★</text> <text wx:if="{{star<i...
2024-01-10微信小程序实现省市区三级地址选择
国际惯例先上效果图：省市区三级联动，选择省自动刷新市，选择市自动刷新区，点击取消自动返回上一级重新选择，点击确定，保存地址。数据库这份数据库是某天在网上逛到的，当时未记录出处，直接贴出给读者使用，实在不妥，此处仅贴出表结构，方便大家交流学习。如有读者了解此份数据...
2024-01-10微信小程序实现点击按钮后修改颜色
这篇文章主要介绍了微信小程序实现点击按钮后修改颜色,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下需实现的功能：点击按钮后，按钮的颜色会加深效果展示：原按钮点击后的按钮思路：给按钮设置一个点击事件，点击了按钮后...
2024-01-10微信小程序 数据缓存实现方法详解
微信小程序可以通过wx.setStorage（wx.setStorageSync）、wx.getStorage（wx.getStorageSync）、wx.clearStorage（wx.clearStorageSync）对本地缓存进行设置、获取和清理。本地缓存最大为10MB。wx.setStorage()---------异步设置缓存微信官方给出的属性OBJECT参数说明：参数类型必填说明keyString是本地缓存中的指定的 key...
2024-01-10详解微信小程序回到顶部的两种方式
在做微信小程序开发时，遇到一个问题，要如何实现返回顶部的功能，下面就用2种方法实现一,使用view形式的回到顶部 HTML：<image src='../../img/button-top.png' class='goTop' hidden='{{!floorstatus}}' bindtap="goTop"></image> CSS：/* 返回顶部 */.goTop{ height: 80rpx; width: 80rpx; position: fixed; bottom: 50rpx; backgrou...
2024-01-10
