格式调整 ctrl+[, ctrl+]:代码行缩进(向前|向后) ctrl+shift+[, ctrl+shift+] :折叠打开代码块 ctrl+C, ctrl+V:复制粘贴,如果没有选中任何文件则复制粘贴一行 shift+alt+F:代码格式化 alt+up, alt+down:上下移动一行 shift+alt+up, shift+alt+down:向上向下复制一行 ctrl+shift+Enter:在当前行上方插入一行 光标移动 ctrl+End:移动到文件结尾 ctrl+Home:移动到…

原文:微信小程序把玩(四)应用生命周期 App() 函数用来注册一个小程序,注意必须在 app.js 中注册,且不能注册多个. 使用方式也跟Android中的Application中初始化一些全局信息以供使用. 方法: 应用生命周期代码:…

原文:微信小程序把玩(四十)animation API 动画水还是比较深的,这里只是简单介绍下小程序中动画的一些属性和注意事项,做动画前一定要整理好思路将动画一步步分解,再进行组合!这里只做引入. wx.createAnimation(object) 看官方介绍 1.创建一个动画实例animation.调用实例的方法来描述动画.最后通过动画实例的export方法导出动画数据传递给组件的animation属性. 2.调用动画操作方法后要调用 step() 来表示一组动画完成,可以在一组动画中调用任…

原文:微信小程序把玩(四十一)canvas API 绘图是每个移动应用必备的技术,基本上和Android,IOS,等移动开发都是相同的,创建个上下文,给你个画布再上画,官网给的小例子都比较全了自己去看吧,drawImage时没有反应不知道是BUG还是电脑不能测试待定,http://wxopen.notedown.cn/api/api-canvas.html 屏幕就像是数学上的坐标轴,且在第四象限,以屏幕左上角为圆点,X轴向右为正向左为负,Y轴向下为正向上为负(这点和数学上相反的)以圆点为基点画个…

本文系转载: 原文作者:chenzheng8975 原文地址:https://www.cnblogs.com/chenzheng8975/p/9605186.html 微信小程序常用样式汇总 小程序特点:用完即走.低频使用.性能要求低,不支持webview: 以iphone6尺寸(750*1334)为视觉稿进行设计: iphone6下1px=1rpx=0.5pt     iphone6 plux下1px=0.6rpx: 使用rpx,小程序会自动在不同的分辨率下进行转换,而使用px为单位不会: 1…

现在我们已经学会使用工具了,再来了解,测试一下微信小程序的常用组件,所谓组件,就是微信团队已经开发好的一些常用标签,我们只需要掌握用法就可以了,当然,以后学得深入了,也可以开发自己的组件,让其他人使用,这是程序员的更高层境界.好了,闲言少叙,进入正题. 微信小程序组件开发文档:https://developers.weixin.qq.com/miniprogram/dev/component/,各位可以参考这个文档,来快速学习. 一.text 显示文本组件,在index.wxml中键入如下代码…

天河在阔别了十几天之后终于又回来了.其实这篇文章里的demo是接着(天河微信小程序入门<三>)后面就做了的,但是因为最近在做别的项目,所以就偷懒没有发出来.放到今天来看,从前台提交数据到数据库已经是没有什么可写的了.不过既然开篇了就不能太监么,所以还是分享出来给大家.我当时的目的是为了实验api的功能和跟后台数据的通讯存储,所以没有考虑到美观之类的,界面非常丑请大家包涵.一个带form表单的页面在这里定义好自己form表单的元素名称   01 02 03 04 05 06 07 08 09 1…

微信小程序开发系列教程 微信小程序开发系列一:微信小程序的申请和开发环境的搭建 微信小程序开发系列二:微信小程序的视图设计 微信小程序开发系列三:微信小程序的调试方法 这个教程的前两篇文章,介绍了如何用下图所示的微信开发者工具自动生成一个Hello World的微信小程序,并讲解了这个自动生成的微信小程序的视图开发原理. 本文继续介绍这个微信小程序的控制器index.js的实现, 即MVC设计理念的C-Controller-控制器.不过严格意义上说,按照微信小程序官方文档里介绍的,微信小程序实际…

线程架构 从前面的章节我们可以知道,.js文件是页面逻辑处理层.我们可以按需在app.js和page.js中添加程序在生命周期的每个阶段相应的事件.如在页面的onLoad时进行数据的下载,onShow的时候进行数据的更新. 典型的app.js代码结构如下: App({ onLaunch: function(){ //启动时执行的初始化工作 }, onShow: function(){ //小程序从后台进入前台时,触发执行的操作 }, onHide: function(){ //小程序从前台进入后…

1.图片标签: <image src="/images/aaa.png"></image> 2.文本标签: <text>Hello</text> 3.swiper滑动轮播: <swiper catchtap="onSwiperTap" vertical="{{false}}" indicator-dots="true" autoplay="true" i…

1. 自定义组件 类似Vue或react中的自定义组件 小程序允许我们使用自定义组件的方式来构建页面 1.1 创建自定义组件 类似于页面, 一个自定义组件由json wxml wxss js 4个文件组成 可以在微信开发者工具中快速创建组件的文档结构 在文件夹内 components/myHeader, 创建组件 名为myHeader 1.1.1 声明组件 首先需要在组件的 json文件中进行自定义组件声明 myHeader.json { "component": true, } 1.…

16.WXSS特性之模板及引用 模板引用 index.wxml <template name="tempItem"> <view> <view>收件人:{{name}}</view> <view>手机号:{{phone}}</view> <view>地址:{{address}}</view> </view> </template> <template is=&q…

关于小程序 张小龙定义小程序: 1.不需要下载安装即可使用: 2.用完即走,不用关心是否安装太多应用: 3.应用无处不在,随时可用. 特点: 1.适合业务逻辑简单的应用: 2,.适合低频应用: 3.适合性能要求不高的应用. 哪些类型的应用适合小程序? 类似于饿了么.滴滴.淘票票 --------------------------------------------------------------------------------------------------------------…

1. 生命周期 1.1 对应阶段说明 onLOad(Object query) 1.1 页面加载时触发, 一个页面只会调用一次, 可以在 onLoad的参数中获取打开当前页面路径中的参数 1.2 参数: 名称 类型 说明 query Object 打开当前页面路径中的参数 onShow() 2.1 页面显示/切入前台时触发 2.2 会执行多次 onReady() 3.1 页面初次渲染完成时触发, 一个页面只会调用一次, 代表页面已经准备妥当, 可以和视图层进行交互 onHide() 4.1 页面…

WXML 中的动态数据均来自对应 Page 的 data. 一.简单绑定 数据绑定使用 Mustache 语法(双大括号)将变量包起来,可以作用于: 1.内容 <view> {{ message }} </view> Page({ data: { message: 'Hello MINA!' } }) 2.组件属性(需要在双引号之内) <view id="item-{{id}}"> </view> Page({ data: { id: 0…

1. 表示操作成功,文字上方会显示一个表示操作成功的图标. wx.showToast({ title: '操作成功!', icon: 'success', duration: 1500 // 提示窗停留时间 }) 2.表示加载中,显示为加载中图标. wx.showToast({ title: '加载中...', icon: 'loading', duration: 1500 }) 3.不显示图标,一般用作提示. wx.showToast({ title: '该功能未上线!', icon: 'no…

承接上篇博客. 通过点击按钮跳转到新的页面. 先创建新页面home: 代码如下: // home.js Page({}) // 注册页面 // home.json {} // home.wxml <text>home页面</text> home页面创建好后,去app.json里面配置路径: // app.json { "pages": [ "qrcode/index/index", "qrcode/home/home" ]…

bind bind事件绑定不会阻止冒泡事件向上冒泡,catch事件绑定可以阻止冒泡事件向上冒泡. bindtap  跳转页面 bindchange  .value 改变时触发 change 事件 bindblur. 编辑器失去焦点时触发 bindinput  . 编辑器内容改变时触发…

      <view class="font-bold tab-content"> <!-- 循环列表 --> <block wx:for="{{jobList}}" wx:key="{{item.deptId}}"> <!-- 点击时会触发事件viewDeptTwo ,并且携带数据(data-id)--> <!-- 当点击时候会触发函数,将标识符deptId转为item.deptId中的值…

function zero_fill_hex(num, digits) { let s = num.toString(16); while (s.length < digits) s = "0" + s; return s; } /** * rgba 转 16进制 * @param rgb * @returns {*} */ function rgb2hex(rgb) { if (!rgb) { return rgb; } if (rgb.charAt(0) === '#') r…

1.设置全局字体样式app.wxss: text{ font-family:MicroSoft yahei; } 2.设置弹性盒子模型: .container{ /*弹性模型*/ display:flex; /*垂直方向 列方向 排布*/ flex-direction:column; /*居中*/ align-items:center; /*要从整体解决排布的问题是最好的方案*/ } 3.设置页面全屏样式及背景色: page{ height:100%; background:#b3d4db; }…

util.js function isPhone(value) { if (!/^1(3|4|5|7|8)\d{9}$/.test(value)) { return false } else { return true } } //验证码六位数校验 function isSixNum(value) { if (!/^\d{6}$/.test(value)) { return false } else { return true } } //身份证号不严格校验 function isCard(va…

作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有,转载请联系作者获得授权.微信小程序正式公测,公测时间:11月3日夜:公告地址:https://mp.weixin.qq.com/cgi-bin/announce?action=getannouncement&key=1478163659&version=14&lang=zh_CN公测配套使用攻略:微信小程序公测接入指南整理了一下…

一:官方地址集合: 1:官方工具:https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debug/wxadoc/dev/?t=1476434677599 3:设计指南:https://mp.weixin.qq.com/debug/wxadoc/design/index.html 4:设计资源下载:https://mp.wei…

作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 张小龙全面阐述小程序,定档1月9日上线(附90分钟演讲全文) ... 前言:新人第一坑,跳坑指南:修改后,必须保存:ctrl+S: 一:推荐地址集合:(初入门者请先看这里) 1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=147643467…

1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debug/wxadoc/dev/?t=1476434677599 3:设计指南:https://mp.weixin.qq.com/debug/wxadoc/design/index.html 4:设计资源下载:https://mp.weixin.qq.com/debug/wxadoc/design/#资源…

exports 关键字      .wxs 通过该属性,可以对外共享本模块的私有变量与函数   使用步骤 1. 在 .wxs后缀文件 exports定义参数 var foo = "'hello world' from comm.wxs"; var bar = function(d) { return d; } module.exports = { foo: foo, bar: bar }; 2. 在 .wxml 后缀文件引入 .wxs文件,直接使用变量 <wxs src=&quo…

微信小程序入门篇: 准备工作 IDE搭建 就不多说了,没有内测码去下载个破解版吧,我用了一下,学习完全够了!IDE破解版+安装教程 图片发自简书App 知识准备 JavaScrip还是要看看的,推荐教程 廖雪峰大神的博客 HTML+CSS 大概知道是干啥的就行 从零开始 微信小程序中就四种类型的文件 js ---------- JavaScrip文件 json -------- 项目配置文件,负责窗口颜色等等 wxml ------- 类似HTML文件 wxss ------- 类似CSS文件…

微信小程序开发系列教程 微信小程序开发系列一:微信小程序的申请和开发环境的搭建 微信小程序开发系列二:微信小程序的视图设计 微信小程序开发系列三:微信小程序的调试方法 微信小程序开发系列四:微信小程序之控制器的初始化逻辑 通过前面四个章节的介绍,大家对微信小程序的视图和控制器,以及微信调试器的用法已经有了一个最基本的认识了.在这个基础上,让我们进一步学习微信小程序控制器,掌握在小程序控制器中响应用户输入的方法. 这个例子很简单,在微信小程序的视图index.wxml里,我定义了一个按钮,和一个文…

微信小程序开发系列教程 微信小程序开发系列一:微信小程序的申请和开发环境的搭建 微信小程序开发系列二:微信小程序的视图设计 微信小程序开发系列三:微信小程序的调试方法 微信小程序开发系列四:微信小程序之控制器的初始化逻辑 微信小程序开发系列五:微信小程序中如何响应用户输入事件 通过前面五个章节的介绍,大家对微信小程序的视图和控制器,微信调试器,以及如何在微信控制器里编写JavaScript函数来响应微信小程序的用户事件已经有了一个最基本的认识了.我们现在来开发一些和微信应用相关的知识,进一步巩固…