小程序
美的人是吃货
昨日以昨,今日以今
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
小程序 修改头部 文字 标题
写在前: 修改小程序当前页头部标题 小程序文档地址wx.setNavigationBarTitle({ title: '当前页面'})使用父级文字:1,父级传参: // 点击列表项 onitem: function (e) { // es6写法 在页面上自定义的属性 let { helptypeid, isfile, itemid } = e.currentTarget.dataset; let n...原创 2020-05-13 17:24:13 · 2232 阅读 · 0 评论 -
小程序 订阅消息功能实现 wx.requestSubscribeMessage
写在前: 小程序 服务通知 订阅消息功能 小程序文档地址 (前端部分)第一步,html 内容,添加按钮点击事件<text>{{textcontent}}</text><button bindtap="subTap" hover-class="other-button-hover">允许订阅消息</button>第二步,js ...原创 2020-03-07 17:47:23 · 16410 阅读 · 3 评论 -
小程序 button禁用后样式记录
写在前:小程序提供组件,button禁用之后的样式wx-button[disabled]:not([type]) { background-color: #fbb0b0; color: #ffffff;}原创 2019-07-09 11:26:37 · 895 阅读 · 0 评论 -
小程序 获取当前时间的前五天
写在前:记录一下js 中获取时间的方式,和其转化过程<view class="intro"> <block wx:for="{{timearr}}" wx:key="index"> <text>{{item.time}}</text> </block></view>在页面中循环出时间,如上.i...原创 2019-07-04 15:00:54 · 1643 阅读 · 0 评论 -
小程序 左滑动删除效果
写在前:手指向左滑动 删除当前手机号码布局:内容和删除按钮在同一个区域内,并循环数据<view class="phone-content"> <view class="phone-logic"> <view class="local"> <view class='local-img row'> <...原创 2019-07-05 16:41:34 · 551 阅读 · 0 评论 -
小程序 自定义单页面头部导航栏(标题栏)
写在前:自定义头部标题栏,并封装引用到需要的页面。实现单页面可用自定义头部(未封装)首先:根据小程序文档顶配置项 在需要自定义的页面的json文件中添加下面的配置{ "navigationStyle": "custom"}其次:为适配各手机顶部状态栏高度高度不同,动态获取高度并存放在全局变量中(放到app.js中)App({ onLaunch: functio...原创 2019-07-11 17:21:37 · 11604 阅读 · 1 评论 -
小程序 自定义开关组件
写在前:想自己写一个开关switch 如下图;并写成组件 首先,根据小程序文档提供的自定义组件;可以新建一个文件夹 包括: json wxss wxml js 四个文件夹;小程序右键,新建Component 之后,此文件夹json中已经设置:"component": true, js文件夹也是已经初始化好了。其次,可以先引用这个组件,然后看效果;...原创 2019-08-14 15:20:25 · 1886 阅读 · 0 评论 -
小程序 聊天功能 页面滚动到底部
写在前:当我们给一个类设置overflow-y: scroll;overflow: hidden; 的时候,wx.pageScrollTo不起作用。1.给盒子定义一个id为x_chat;(其他样式,按需定义) <view id="x_chat" class="dialog" > </view>2.封装成方法,在onReady时调用;(滚动用到的wx...原创 2019-09-06 16:13:23 · 3613 阅读 · 0 评论 -
小程序 绘制饼状图
写在前:按照比例绘制饼状图实现效果:布局<view class="left"> <cover-view class="white"></cover-view> <canvas style="width: 136px; height: 136px;" canvas-id="Canvas"></canvas><...原创 2019-06-01 16:43:48 · 3829 阅读 · 1 评论 -
小程序获取屏幕宽度,高度
写在前:只是记录一下小程序提供的接口地址(地址)场景描述:想实现一个区域块切换,下方小点切换原创 2019-05-27 15:11:17 · 2161 阅读 · 0 评论 -
小程序 map地图中,在地图中心点固定一个标记,并逆解析标记地址
写在前:想实现在地图中心点出现一个位置标记,两种方式,一种固定在地图中心点,另个种,地图滑动后,中心点改变。效果图:在地图中心显示地图:我们使用小程序提供的组件来显示地图(map组件 详情)<map id="map" longitude="{{longitude}}" latitude="{{latitude}}" bindregionchange="mapchangeT...原创 2019-05-07 16:19:21 · 9329 阅读 · 2 评论 -
微信小程序 获取手机号授权登录
小程序可以通过微信官方提供的登录能力方便地获取微信绑定的手机号来实现一键登录第一步,你需要先调用wx.login() 获取到 code (微信小程序登录)第二步,获取手机号 (因为需要用户主动点击才能实现,所以要使用button,代码如下) <button bindgetphonenumber="getPhoneNumber" open-type="getPhoneN...原创 2019-01-10 18:26:31 · 8150 阅读 · 2 评论 -
关于小程序 textarea 遇到的问题记录
1,show-confirm-bar 不起作用的问题(解决方法) <textarea show-confirm-bar="{{false}}" />2.textarea 绑定事件(多文本绑定事件记录) <textarea bindinput='inputTap' />3.提交成功后置空多文本(添加value) <textarea bindin...原创 2019-02-21 17:17:33 · 536 阅读 · 0 评论 -
小程序动画
效果:点击开启 旋转180度 显示关闭(如图)实现过程1.这是html<view class='expriment-content'> <view class='flips'> <view class='flip b1' animation="{{animationMain}}" bindtap='roateTap' data-id='1...原创 2019-02-23 17:49:24 · 357 阅读 · 0 评论 -
手机号,密码类正则验证
1.小程序手机号登录情景描述:登录注册时需要验证手机号不能为空,手机号符合移动/联通/电信等手机号特殊组建数字排序和长度(正则表达式)//手机号正则表达式:let phone =/^1[34578]\d{9}$///另一种写法let phone = /^1(3|4|5|7|8)\d{9}$/其中:^ :匹配输入字符串的开始位置;\d:匹配一个数字字符,价于 [0-9];...原创 2019-03-29 11:33:13 · 500 阅读 · 0 评论 -
小程序 wx:for 为每个循环出来的view,添加相同的动画,并且互不影响
写在前:想实现通过wx:for 为每个循环出来的元素添加动画,并且动画之间互不影响,自定义写法描述:添加多个地址,想要删除其中的任意一个的时候有一些动态效果,向左后向右滑动删除复现第一步:首先是静态页面布局和一些简单的样式<!-- 因为数据是渲染的所以,所以如果你只复制html 到你的项目将什么都不显示 --><view class="addbox">...原创 2019-04-22 16:43:16 · 2719 阅读 · 0 评论 -
小程序 为数组中的对象添加元素,修改元素
写在前:想添加一个属性,向data中的、某个数组中、已存在的对象中。第一步:静态页面使用wx:for 循环数据(本例中使用假数据)<block wx:for="{{timearr}}"> <view class="timeterm row"> <view class="borderbg {{item.timecolor}}">{{item.tim...原创 2019-05-05 18:36:04 · 12672 阅读 · 1 评论 -
小程序 模板使用(动画/传值)
写在前面:关于小程序,记录在项目中使用的模板,页面和模板间的传值,引入,使用方法;第一步,新建一个文件夹(demo-template)第二步,新建一个wxml 的文件(demo-template.wxml)<!-- 必须有name 以便需要的页面用 is 引用 --><template name='radio'> <view class="rad...原创 2019-04-30 13:51:10 · 431 阅读 · 0 评论 -
小程序,子向父页面传值(两种方式)记录
写在前:因为常用,所以记录一下,子级页面向父级页面传值的方法,如,本地存储,路由传值(本地数据)在父页面中的data中接收子页面传回来的值data:{ arr: []},//页面显示的时候可以处理子页面返回来的数据onShow: function() { console.log(this.data.arr)},在子页面中,使用 wx.navigateBac...原创 2019-05-06 16:51:44 · 2448 阅读 · 1 评论 -
当前页面实现简单搜索功能
功能描述:在搜索框中输入内容,在渲染出的网络数据中取出带输入关键字的内容,单独显示功能实现:1.index.wxml:循环一个数组<view class='preson'> <input bindinput="personTap" type="text" placeholder-style="color:#999;font-size:12px;text-alig...原创 2018-12-08 15:24:34 · 6521 阅读 · 0 评论
分享