微信开发

简介： 总结： 1. 逻辑层使用js引擎，视图层使用webview渲染 2. 微信小程序已经支持了绝大部分的 ES6 API 3. 可以自动补全css的兼容语法 文档： https://developers.weixin.qq.com/miniprogram/dev/framework/details.html 一. 设计 总结： 设计图750px， 1px = 1rpx，方便计算 二. 小程序页面结构 wxml: 功能类似html，描述节点，但小程序的 WXML 用的标签是 view , button , text 等等，这些标签就是小程序给开发者包装好的基本能力，我们还提供了地图、视频、音频等等组件能力 wxss: 类似css，有css大部分属性： 1. 单位rpx 2. 样式导入和less等css预处理器一致，用@import 3. 不能用嵌套选择器 js: 微信小程序的 JavaScript 运行环境即不是 Browser 也不是 Node.js。它运行在微信 App 的上下文中，不能操作DOM，没有window, document, 也不能通过 Node.js 相关接口访问操作系统 API JS 脚本文件通过改变数据来处理用户的操作 Page({ data: { msg: '' }, clickMe: function() { this.setData({ msg:

http://blog.csdn.net/qq_26420489/article/details/62044014 先看下效果图. 代码: 1.popMenu.js [html] view plain copy Page({ data: { isPopping: false,//是否已经弹出 animPlus: {},//旋转动画 animCollect: {},//item位移,透明度 animTranspond: {},//item位移,透明度 animInput: {},//item位移,透明度 }, //点击弹出 plus: function () { if (this.data.isPopping) { //缩回动画 this.popp(); this.setData({ isPopping: false }) } else if (!this.data.isPopping) { //弹出动画 this.takeback(); this.setData({ isPopping: true }) } }, input: function () { console.log("input") }, transpond: function () { console.log("transpond") }, collect: function () { console.log(

最近在整理我在大厂面试以及平时工作中遇到的问题，记录在 shfshanyue/Daily-Question 中，但觉得对于时时回顾，常常复习仍然做的不够。 于是在微信公众号中开发了随机生成模拟面试的功能，由于觉得比较简单且有趣，于是分享了出来 需求 先来谈一谈需求点： 在公众号中回复面试，随机生成 N 道大厂面试题 每道面试题指向一个超链接，可以查看答案 需求很简单，如图下所示。你也可以去我的公众号 全栈成长之路 查看实现效果 内容 在大部分行业中，内容是至为重要的，有内容才会有好的服务，而技术只是整合内容的一种手段。 在本次功能开发中也是如此： 一个面试题库才是至关重要 。 为此，我在 github 上新建了一个仓库，使用 Issue 来记录我在大厂面试中所遇到的面试题及答案 每天一道面试题，有关前端，后端，devops以及软技能，促进职业成长，敲开大厂之门。 到此一步，我拥有了自己的内容，并且拥有了开箱即用的后台管理系统: github issues 数据 此时我们已经拥有了一个特殊的后台管理系统，但很遗憾，由于该管理系统的特殊性，我们并不是数据映射管理系统，而需要根据 Github Issues 来生成结构化的数据，好在我们可以使用 Github API。 Github API 现在已经全部变成了 GraphQL 接口，看来大家又需要学习一门新的技术了。关于 Github

　　首先要知道为什么要用公众号第三方平台， 公众号第三方平台的开放，是为了让公众号运营者，在面向垂直行业需求时，可以一键登录授权给第三方的公众号运营平台，通过第三方开发者提供的公众号第三方平台来完成相关业务。 简单来说就是不懂技术的小白用户一键授权给第三方公司代理开放的权限如发送消息等，不用填写一些繁琐的Appid,AppSecret,URL,Token等信息。博客中已有园友写了详细的内容，以下只是强调开发过程中的一些问题。 微信的授权流程 具体的详情请见官网 接下来就首先要申请公众号第三方平台，具体流程见 官网 。特别注意的是 平台名称是不可以改变 的，一个账户只能创建 5个第三方平台 ，如果填写错了资源就浪费了，且资质认证需要300RMB。 权限集就根据你的实际需要选择，一旦授权后将会 拦截用户公众号发过来的所有信息 。 开发资料包含两部分：登录授权相关、授权后代替公众号实现业务。 授权测试公众号 和 授权体验页 还有 白名单列表 需要注意，后面测试时需要用到，不要用其它测试帐号，否则一旦出现问题找原因会浪费很多时间。 最后等待两三天就审核通过。 　　开发注意事项 推送 component_verify_ticket 协议，component_verify_ticket是微信端服务器每隔10分钟定时推送给上面所填授权通知页，我们要把component_verify

Table of Contents 一、列表渲染 二、条件渲染 wx:if vs hidden 三、举例 一、列表渲染 列表渲染就是，对数组中各项的数据重复渲染。 在组件上使用 wx:for 控制属性绑定一个数组，即可使用数组中各项的数据重复渲染该组件。 以下是一个例子： 使用 wx:for-item 可以指定数组当前元素的变量名。 使用 wx:for-index 可以指定当前下标的变量名。 wx:key 官方文档里写的是： 如果列表中项目的位置会动态改变或者有新的项目添加到列表中，并且希望列表中的项目保持自己的特征和状态（如 input 中的输入内容， switch 的选中状态），需要使用 wx:key 来指定列表中项目的唯一的标识符。 wx:key 的值以两种形式提供 字符串，代表在 for 循环的 array 中 item 的某个 property，该 property 的值需要是列表中唯一的字符串或数字，且不能动态改变。 保留关键字 *this 代表在 for 循环中的 item 本身，这种表示需要 item 本身是一个唯一的字符串或者数字 当数据改变触发渲染层重新渲染的时候，会校正带有 key 的组件，框架会确保他们被重新排序，而不是重新创建，以确保使组件保持自身的状态，并且提高列表渲染时的效率。 如不提供 wx:key ，会报一个 warning ，

https://blog.csdn.net/lwx0313/article/details/77451734 https://blog.csdn.net/yjl223/article/category/6866883 https://www.sohu.com/a/197098358_221103 https://www.cnblogs.com/ssrstm/p/6855572.html 积分商城： https://bbs.youzan.com/thread-667563-1-1.html https://jingyan.baidu.com/article/cbf0e500451b0a2eaa2893a9.html 有赞社区： https://bbs.youzan.com/forum.php?mod=forumdisplay&fid=2&filter=typeid&typeid=46 懒人模板： http://www.lanrenmb.com/tags.php?/%CE%A2%D0%C5%D0%A1%B3%CC%D0%F2demo%D4%B4%C2%EB/ http://www.jisuapp.cn/make/?a=1&b=55&c=-1 微信支付： https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_3

这个过程，折腾了一下午，记录在这里，备忘，同时也供有需要的人参考： 1、安装node.js 官网下载： https://nodejs.org/en/download/ 在cmd命令行窗口输入node -v和npm -v，如可打印版本号，则node和npm安装成功 2、添加环境变量 在用户环境变量path下，添加nodejs的安装目录，否则在非安装盘下执行npm会报错； 3、项目根目录下新建文件夹cloudfunctions，project.config.json里添加配置： 4、右键cloudfunctions文件夹，新建云函数： 在index.js里填写如下示例代码： // 云函数入口文件 const cloud = require('wx-server-sdk') cloud.init() // 云函数入口函数 exports.main = async (event, context) => { // ... return { sum: event.a + event.b } } 5、进入云函数所在的文件夹： 弹出cmd窗口： windows的cmd下进入指定目录，有一点跟linux不一样， 进入某个磁盘，直接盘符代号：如D：，不用CD 命令切换。进入某个盘后，再cd 进入目录 可用cd ..进入上级目录 6、执行命令，安装wx-server-sdk npm install -

注册微信公众号 作为开发者，可以注册公众平台，在未审核的情况下使用测试账号来测试功能 个人只能注册订阅号https://mp.weixin.qq.com 订阅号 服务号 企业号 三者能使用的功能不相同 注册的账号需要跟微信号绑定（微信号需要绑定银行卡） 注册地址： https://mp.weixin.qq.com/cgi-bin/readtemplate?t=register/step1_tmpl&lang=zh_CN 注册需要邮箱激活 登录微信公众平台 微信公众平台登陆后，用户可以直接使用微信公众平台进行消息群发，添加微信公众号菜单等 给公众号添加测试账号 作为开发人员，可以使用普通微信号来测试功能 登陆公众平台后，在开发》开发者工具》里面可以扫描二维码添加测试账号 此过程需要扫描你微信几次 扫描测试号二维码可以给测试公众号添加测试账号 在功能》群发功能》添加文字群发， 看测试账号是否收到 不过由于上面直接公众平台群发功能是正式的功能，所以一天只能群发一条消息 测试号则比这个权限多 使用普通的微信号，扫描这些地址，就可以关注微信公众号的测试账号 有了微信公众号测试账号和普通微信测试号，我们才能进行其他的开发 对微信进行接口开发 该功能允许我们调用微信的接口，进行第三方系统的对接，这样我们在微信平台上面的很多操作，就不需要在微信平台上面操作了

公众号分类 一、订阅号 具有信息发布与传播的能力，适合个人及媒体注册 二、服务号 具有用户管理与提供业务服务的能力，适合企业及组织注册 三、企业号 具有实现企业内部沟通与内部协同管理的能力，适合企业客户注册 四、小程序 具有出色的体验，可以被便捷地获取与传播，适合有服务内容的企业和组织注册 公众号功能区分 微信相关平台 微信开放平台 （https://open.weixin.qq.com） 微信公众号平台 （https://mp.weixin.qq.com） 微信支付商户平台 （https://pay.weixin.qq.com） 微信公众号平台 编辑模式 可编辑：自动回复、图文消息、自定义菜单 开发模式（微信认证） 功能插件：模板消息、客服功能、扫一扫、自定义菜单、等等 开发模式下的配置： 1、JS接口安全域名设置 2、网页授权域名 名词解释 access_token： 公众平台以access_token为接口调用凭据，来调用接口，所有接口的调用需要先获取access_token，access_token在2小时内有效，过期需要重新获取，但1天内获取次数有限，开发者需自行存储。 openid： 为了识别用户，每个用户针对每个公众号会产生一个安全的OpenID。 微信公众号平台技术文档：https://mp.weixin.qq.com/wiki 在线接口调试工具：https:/

若无小程序开发经验，可先阅读 玩转微信小程序 一文。 微信小程序正式上线已有几周时间，相信它的开发模式你已烂熟于胸，可能你也有所疑问，我竟能用 web 语言开发出如此流畅的几乎原生体验的应用。可能你又会猜这不就是 h5 么，厉害点的想不就是 hybrid 么。但是在我们的开发旅途中至始至终都没有使用过 webview ，为啥呢？开发时用的 view 一类的标签，浏览器又是怎么解析成页面的呢？带着重重疑惑，进入微信小程序源码分析吧！ 开发平台 这个 IDE 是如何保证我们小程序的开发和预览的？简要分析两点。 1. 文件目录 打开 微信web开发者工具目录 ，进入 package.nw ，嗯？熟悉的味道来了。里面就3个文件： app ， node_modules ， package.json 。显然我们开发时构建阶段所用资源来自于 node_modules ，于是我尝试找下 react模块 ，结果没有收获... 进入 app 目录下，呈现的四个文件夹分别是： html ， style ， images ， dist 。而你开发时使用的 IDE 的实现正是通过这些文件，不妨用浏览器打开其中一个 html 看看。 这不就是从桌面打开后看到的效果吗（其中 nodeWebkit 提供了 web 到桌面应用的转换）。并且在 index.html 中找到我们的主脚本文件 ../dist/app