前言 启动页在APP中是个很常见的需求,为什么对于小程序来说也非常重要呢?首先我描述一下我在开发过程中遇到的一些问题以及解决的步骤,到最后为什么要加启动页,看完你就明白了。 小程序的首页需要展示用户关注的小区信息,意味着一打开小程序我就得先执行登录的逻辑,只有登录了之后才能获取用户关注的小区信息。 在小程序启动的时候自动登录,目前没获取用户信息,所以不需要用户授权,这个逻辑放在根目录下的app.js的onLaunch...
一、前言相信做过微信小程序开发的人应该都碰到过这个问题,因为这个需求实在太常见了由于textarea是属于原生组件,层级最高,不管在页面中我们设置z-index值多少都会被textarea组件遮挡住,很影响用户体验, 目前官方对该问题还没有修复,当然官方也给出了解决该问题的其他方案,使用cover-view和 cover-image替代,但个人感觉并不是很好,有一些限制 二、使用场景及解决方案1、弹窗显示2、底部fixed定位的按钮,页面滚动时,例如...
前言 由于小程序中的textarea组件是原生组件,而原生组件的层级是最高的,所以页面中的其他组件无论设置 z-index 为多少,都无法盖在原生组件上,造成输入的文字会显示在小程序其他组件上,如下图所示:<view class=bar bottomfix shadow justify-center><button class= formType="submit" type="primary" style=font-size:12pt;border:0px;width:300px;> 保 存</button></view>网上有一些绕弯路的解决办法,其实小程序有一个直接解...
前言:这篇文章讲什么微信小程序中 textarea 组件的层级过高如何解决 前言:这篇文章对谁有用微信小程序开发者 前言:本文有什么用?提供解决问题的思路,供你参考(因为时间关系,我没法把代码整理的好好的然后贴出来让你复制黏贴。或者是做成一个组件然后开源) 前言:本文时效性截止至2018年10月30号,微信的 textarea 还是以原生组件形式实现,因此层级最高。无法通过 z-index 进行调整。在微信小程序官方把 textarea 改成了可...
前言使用promise 队列,保存多张图片到手机相册问题:有些手机会出现只能保存五张图片,报错信息:无法写入promise需要好好学习 核心代码// pages/saveImgs/index.js import { writePhotosAlbum } from ../../utils/util Page({/*** 页面的初始数据*/data: {list: [https://timgs.top1buyer.com/admin/special/special_img_20190301160008479.jpg,https://timgs.top1buyer.com/admin/special/special_img_20190301160013201.jpg,http...
本文实例讲述了微信小程序获取网络类型的方法。分享给大家供大家参考,具体如下: 这里主要演示通过wx.getNetworkType获取当前网络类型的操作方法。代码如下: index.js: Page({/*** 页面的初始数据*/data: {netType:},/*** 生命周期函数--监听页面加载*/onLoad: function () {var that = this;try {wx.getNetworkType({success: function(res) {that.setData({netType:res.networkType})},})} catch (e) {// Do something when c...
摘要: Fundebug的微信小程序错误监控插件更新至0.5.0,支持监控HTTP请求错误。接入插件 接入Fundebug的错误监控插件非常简单,只需要下载fundebug.0.5.0.min.js,在app.js中引入并配置apikey: var fundebug = require(./libs/fundebug.0.5.0.min.js) fundebug.apikey = "API-KEY";获取apikey需要[免费注册](https://www.fundebug.com/team/create)帐号并且[创建项目](https://www.fundebug.com/project/create)。创建项目时语言请...
本文实例讲述了微信小程序五子棋游戏的棋盘,重置,对弈实现方法。分享给大家供大家参考,具体如下: DEMO下载 五子棋对弈、悔棋DEMO 效果图分析 1. 采用微信小程序的canvas制作五子棋; 2. 确定棋盘大小及格数; 3. 绘制棋盘—-通过棋盘宽高和格数计算间距,同时保存坐标点; 4. 黑方和白方下子—-定义一个布尔变量代表各自的身份; 5. 重置棋盘—-重新开始; 6. 通过判断当前棋手,悔棋时进行改变。 绘制棋盘 drawLine(arr){arr....
本文实例讲述了微信小程序五子棋游戏的悔棋实现方法。分享给大家供大家参考,具体如下: DEMO下载 五子棋悔棋DEMO 效果图分析 悔棋功能需要的操作: 1. 判断当前持棋人; 2. 清空棋盘; 3. 将当前持棋人的棋子数组的最后一个棋子还原到全局坐标数组的位置; 4. 删除当前持棋人的棋子数组的该坐标。 js this.page.changeUndo = function(e){if (self.START_GAME){var lastM = self.myPoint.length - 1;var LastA = self.AIPoint.len...
本文实例讲述了微信小程序五子棋游戏AI实现方法。分享给大家供大家参考,具体如下: DEMO下载 五子棋AI篇DEMO 效果图原理 1. 将棋盘中能够胜利的五子连珠方法遍历一个数组; 2. 当AI持棋时,遍历棋盘中所有棋子的空位; 3. 如果用户落子该位置,给用户该位置的五连珠方式进行加分:1连10分,2连20分,3连40分,4连80分; 4. 如果AI落子该位置,给AI该位置的五连珠方式进行加分:1连15分,2连25分,3连45分,4连85分; 5. 最后对该位...
最近在学习小程序的编写,需要调用后端接口,经常要用到wx.request方法,所以就自己封装了一下,简化一下代码,如果能给大家提供帮助更好,我的项目后端是使用的Java SSM框架,wx.request的URL就是后端提供的接口。在封装的时候我在网上看了很多篇博客,90%以上的全都是直接在success回调函数中直接打印返回值console.log(res.data)这个当然是没有问题的,但是我们都知道微信小程序的数据是实现数据绑定的,这一点和Vue框架很像,而...
本文介绍了微信小程序实现仿微信聊天界面,分享给大家,具体如下: 下面先来看看效果为实现这样的效果,首先要解决两个问题: 1.点击输入框弹出软键盘后,将已有的少许聊天内容弹出,导致看不到的问题; 2.键盘弹出或收起时,聊天消息没有自动滚到最底部。 首先解决第二个问题,自动滚动到最底部,这很简单,这里提供三种方法(推荐第三种):1.计算每条消息的最大高度,设置scroll-top=(单条msg最大高度 * msg条数)px。 2.用 将展...
本文实例为大家分享了微信小程序实现banner图轮播的具体代码,供大家参考,具体内容如下 效果图:indicator-active-color="#007aff"//修改选中图片圆点的颜色js: const app = getApp()Page({data: {//-----------模拟banner图-----------imgUrls: [/image/1545118381903.jpg,/image/1545118566631.jpg],circular: true,//是否显示画板指示点 indicatorDots: true,//选中点的颜色 //是否竖直 vertical: false,//是否自动切换 autopl...
本文实例为大家分享了微信小程序实现简单表格的具体代码,供大家参考,具体内容如下 效果图:wxml <view class="table"><view class="tr bg-w"><view class="th">SPB</view><view class="th">DPB</view><view class="th ">日期</view></view><block wx:for="{{listData}}" wx:key="{[code]}"><view class="tr" wx:if="{{index % 2 == 0}}"><view class="td">{{item.code}}</view><view class="td">{{item.text}}</view><view class...
本文实例为大家分享了微信小程序制作表格的具体代码。 微信小程序中没有专门的表格制作工具,不过使用列表渲染可以实现, 下面是我做的表格图片:方法如下: 在XXX.wxml中填写下面的代码 <view class="table"><view class="tr bg-w"><view class="th">参数</view><view class="th-2">内容</view></view><block wx:for="{{listData}}" wx:key="{[code]}"><view class="tr bg-g" wx:if="{{index % 2 == 0}}"><view class="td-1" sele...