微信小程序
文章平均质量分 70
主要记录开发微信小程序中遇到的问题,包含效果入门篇、功能入门篇、尝试入门篇、工具入门篇、功能效果进阶篇等
远方那座山
世界上有两个我,一个在白天里贩卖生活,一个在黑夜里赎回自己;
展开
-
微信小程序入门教程 (二)- 开发工具、项目 新建、分包、命名
新建项目初始结构分包、命名新手方式正确方式新建项目1.扫码登录 - 选取右侧小程序 - 箭头所指新建项目2.新建项目/导入项目初始结构.js、.json、.wxml、.wxss的区别.js文件 逻辑区域.json文件 是页面的配置文件,页面的配置文件是非必要的.wxml文件 UI布局.wxss文件 页面的样式表,页面的样式表是非必要的分包、命名新手方式注:第一...原创 2019-11-04 11:48:09 · 798 阅读 · 0 评论 -
微信小程序 - wxml属性大全
目录入门属性进阶属性display:组件内的元素显示方式。通常设置为flex,使元素更加灵活。入门属性宽、高方式一(具体):width: 100rpx;height: 100rpx;方式二(区间):width: 100%;height: 100%;颜色color: red;背景色 background-color: #eee;字体font-size:...原创 2019-05-24 16:26:24 · 2014 阅读 · 2 评论 -
前端 + 小程序 - 常用方法、功能、工具
陆续补充~字符串转换为数组var str="a,b,c,d";var newArray=str.split(",");//打印出 ["a", "b", "c", "d"]console.log(newArray); 数组转换为字符串var array=['a','b','c','d'];var str=array.join(",");//打印出 a,b,c,d...原创 2019-05-21 10:46:12 · 361 阅读 · 0 评论 -
微信小程序 - 功能、效果进阶篇
项目内功能陆续补全 ~目录微信小程序 - 倒计时60秒(获取验证码)原创 2019-05-22 10:10:30 · 727 阅读 · 0 评论 -
微信小程序 - 工具类的封装与使用
目录工具封装工具使用工具封装微信项目建立之后自带utils文件夹,我们只需要写出自己需要的工具类,然后再封装对应方法即可util.js//相当于外部声明module.exports = { toast: toast,}//toast简单封装function toast(msg) { wx.showToast({ title: msg, icon...原创 2019-05-27 16:12:07 · 763 阅读 · 0 评论 -
微信小程序 - 真机运行toast无效
目录问题出现场景问题解析前置解决方法完美补充注:如操作完前置解决方法已经实现效果,那么可忽略完美补充问题出现场景网络请求后在成功回调内toast无效问题解析主要原因:loading、toast的调用顺序个人理解:因俩者执行在同一队列,当有一者执行时队列被占用,另一者无法执行或已经被隐蔽执行,所以导致我们只看到了菊花消失,却看不到toast展示前置解决方法问题检查:查看是...原创 2019-05-23 10:44:46 · 1696 阅读 · 0 评论 -
微信小程序 - view覆盖
目录主要属性实现步骤完整代码最终效果:view覆盖主要属性 //1.position //2.z-index //父布局 position: relative; //子布局 position: absolute; //view层级顺序 z-index: 1;实现步骤父布局(最外层布局)效果:单一父布局主要属性 position...原创 2019-06-05 14:43:39 · 8000 阅读 · 9 评论 -
微信小程序 - 自封的网络请求框架
因我对于前端是个新手,所以网络框架是我同事封装的,在这里做个记录,部分知识点,我之后了解后会进行记录,以便大家学习 ~目录创建封装使用创建创建一个存放网络框架的文件夹与.js文件,如下封装封装的网络框架 → service.jsconst API_BASE_URL = '请写入 → 这里是我们的服务器域名'const baserequest = (url, method...原创 2019-06-05 17:37:10 · 979 阅读 · 0 评论 -
微信小程序 - 常识入门篇
项目进修中、不断完善 - - ~目录var、let、const的区别let、var、const的区别let → 局部变量作用范围:块级元素内,一般在某个方法或者某个循环内的临时变量注意:需要先声明然后再使用,否则报错var→ 全局变量作用范围:整个类内注意:var定义的变量可以修改,如果不初始化会输出undefined,不会报错const→ 全局变量作用范围:...原创 2019-05-21 10:36:15 · 268 阅读 · 0 评论 -
微信小程序 - 密码的可见与不可见
常规操作注意:工具自带模拟器是没有问题的,真机上存在问题 - -.wxml <view class='parentstyle'> <view class='centerStyle'> <input bindinput="inputNewpassword" maxlength="20" type='{{typeStatus}}' pl...原创 2019-04-30 17:01:48 · 3175 阅读 · 5 评论 -
微信小程序 - 功能入门篇
跳转方式1.“保留当前页面,跳转到应用内的某个页面”wx.navigateTo(OBJECT)// goto:事件 ../mine/jump:跳转类名 goto: function() { wx.navigateTo({ url: '../mine/jump' }) }小程序中左上角有一个返回箭头,可返回上一个页面也可以通过方法 wx.na...原创 2019-03-28 14:16:27 · 555 阅读 · 0 评论 -
微信小程序 - 设置背景图
本来就是简简单单设置一个背景图,非常简单的功能,也就一行代码的事儿,但是没想到竟然另有蹊跷,故此记录一波 ~原创 2019-04-24 09:32:42 · 4188 阅读 · 1 评论 -
微信小程序 - 倒计时60秒(获取验证码)
实现效果功能版wxml描述:这里我没有采用view、text等标签,而是采用了button,主要原因是用到了disabled的属性,作用于发送验证码后事件失效,倒计时完毕之后事件继续生效;//点击属性:sendCode 点击状态:smsFlag 字体颜色:sendColor 显示文字:sendTime<button bindtap="sendCode" disabled=...原创 2019-04-23 16:20:28 · 13725 阅读 · 11 评论 -
微信小程序 - 屏幕适配
现在大部分公司的UI、UE都已经采用了蓝湖这款工具,主要在于扩展性较强,故此篇我们借鉴于蓝湖的尺寸~思考1.移动端的适配方式是否与前端网页的适配方式相同?移动端的适配一般都会在不同手机分辨率下设置对应的dp或pt,然后设备进行对应适配前端的适配,因为没有做过,所以不太熟悉,但是自适应相比而言应该相对简单一些故适配方式应该不同 > <2.微信小程序是属于前端?还是移动端?...原创 2019-04-23 17:38:22 · 4446 阅读 · 0 评论 -
微信小程序 - 常规页面跳转与携带参数跳转
目录常规页面跳转携带参数进行页面跳转常规页面跳转的三种方式1.wx.navigateTo(OBJECT) → 保留当前页面,跳转到应用内的某个页面// goto:事件 ../mine/jump:跳转类名 goto: function() { wx.navigateTo({ url: '../mine/jump' }) }返回方式左上角有一...原创 2019-04-28 11:22:10 · 1795 阅读 · 0 评论 -
微信小程序 - 快速实现分享、转发功能
右上角转发未设置右上角的分享事件,显示为 当前页面未设置分享设置完右上角的分享事件后,显示为 转发官网API地址显示当前页面的转发按钮转发部分Api的作用wx.showShareMenu的真正作用,是控制是否显示转发分享,而不是直接弹出分享界面wx.showShareMenu 的参数 withShareTicket 为 true 时,点击模拟器右上角菜单后出现的转发按钮,...原创 2019-04-28 16:14:07 · 684 阅读 · 0 评论 -
微信小程序 - 顶部Title的设置方式
目录设置顶部状态栏Title动态改变顶部状态栏Title设置顶部状态栏Title实现效果实现方式统一配置 Title: app.json (意思是全局共用一个title:一般设置为项目名)//统一配置Title "window": { "backgroundTextStyle": "light", "navigationBarBackgroundCo...原创 2019-04-28 17:28:30 · 19279 阅读 · 0 评论 -
微信小程序入门教程 (一)- 平台分类与注册小程序
步骤 1:注册步骤 2:选择小程序步骤 3:小程序注册详情页原创 2019-05-05 14:45:23 · 260 阅读 · 0 评论 -
微信小程序 - 效果入门篇
陆续补充 ~前情重点.js文件 逻辑区域.json文件 是页面的配置文件,页面的配置文件是非必要的.wxml文件 UI布局.wxss文件 页面的样式表,页面的样式表是非必要的底部导航栏的实现app.json "tabBar": { "color": "#363636", "selectedColor": "#3cc51f", "backgroundCo...原创 2019-03-29 17:53:16 · 321 阅读 · 0 评论