小程序
有脾气的程序媛
这个作者很懒,什么都没留下…
展开
-
小程序 实现老虎机抽奖 - 可以点击N次,试用各种机型,不会产生误差
先看效果图:点击抽奖,就滚动到后端返回对应的数字,试用各种机型之前试用了background-position的方式去改变数字的背景位置,发奖在小程序使用rpx单位的情况下,会产生误差,且不适配各种机型,于是经过大佬的请教下,改成使用transform: rotateX的方试,话不多说,先上代码axml:<view class="content"> <view class="num-scroll"> <view class="animationImg"&g原创 2020-08-28 15:54:22 · 2757 阅读 · 0 评论 -
小程序实现弹幕功能-无限循环,不会重叠
以下是支付宝小程序代码,先上效果图以下是axml代码:<view class="view"> <block a:for="{{bulletChatData}}" a:key="id"> <text class="item" style="animation: first 8s linear forwards;top:{{item.top}}%;color:{{item.color}};">{{index+item.text}}</text>原创 2020-08-28 10:29:24 · 3225 阅读 · 7 评论 -
小程序 for循环事件只执行一次
前言:相信很大开发者都遇到过这种情况,for循环里面添加一个事件,点击事件通过变量更改样式或者显示某一元素,比如:当我们点击改变state值的时候,所有的元素都会一起改变,但是我们要的只是点击当前的元素,当前的state改变,这个时候,就不能直接定义一个变量去改变它的状态了<view a:for="{{list}}"><!-- 这个state是在js里面的变量,state等于1执行class名为box,不等于1执行class名为boxData --> <view原创 2020-06-02 14:56:10 · 2481 阅读 · 1 评论 -
小程序Canvas 画刻度
canvas是前端工作中不可少的一部分,那么今天就用小程序的canvas画一次刻度尺,希望大家喜欢,同事有更好意见的,也可以在评论去留言哦!1、axml<view> <canvas id="canvas" class="canvas" onTouchStart="start" onTouchMove="move" onTouchEnd="end" /></...原创 2019-11-29 14:35:21 · 1466 阅读 · 0 评论 -
用Promise封装my.request
my.request是支付宝小程序的网络请求方法,原理类似于ajax,我们每次请求的时候都要my.request一次,是不是很麻烦,如果页面很多个请求,那么重复的代码就要写很多次,现在封装成一个简单的全局方法,每次请求只需要调用一次,方便又使用,废话不多说,直接上代码:1、在page同级目录下新建api文件夹,再建api.js文件,文件代码:const BASE_URL = 'https://...原创 2019-10-16 10:04:32 · 855 阅读 · 0 评论