本文目录一览：
1、js的回调函数怎么写，
2、小程序app.js和page中js加载顺序
3、小程序 使用upng.js 把小程序选择的图片转换为base64
4、微信小程序外部js执行自动调用某些代码
5、怎样用js开发微信小程序
js的回调函数怎么写，
in是js保留字，不能用作函数名，否则会语法错误，可以改为其他比如in1
此外代码也要做些修改才行，见下面：
script
function in1(a,b){ //不能用in作为函数名，加个数字就保险了
return a()+b(); //要加括号函数才会执行
}
function o(){
return 1;
}
function t(){
return 2;
}
document.write(in1(o,t)); //直接输出即可
/script
小程序app.js和page中js加载顺序
你把app.js放在前面不就先加载吗？不行你把impower粘贴到app的后面只引入APP试试
小程序 使用upng.js 把小程序选择的图片转换为base64
有时候会遇到后端需要前端获取的图片文件转换成base64，在传给后台
小程序有专门的选择图片接口，
wx.chooseImage(OBJECT)
但是这个只是返回一个图片的临时路径，并不是文件数据本身。
小程序暂时没有接口直接转base64的
所以我们需要使用canvas和canvasGetImageData（小程序版本1.9.0以后要才有）先获取图片内容，
再通过插件upng.js插件实现图片转base64（所需插件文件附件中）
1. 把upng.js和pako.min.js文件放到项目中
2. 在pages下的页面js文件中导入
var upng = require('../../utils/upng.js');
这里只需要导入npng.js ，pako.min.js是在npng,js里面调用
3. 建一个canvas
chooseImage"人脸测试
// 画布
// 生成base64位图片展示 变量imgbase64
need-to-insert-img
4. 添加js点击chooseImage事件
chooseImage: function() {
var that = this;
var coss_signature = wx.getStorageSync('cos_signature');
var canvasID = "imgCanvas";
var canvas = wx.createCanvasContext(canvasID)
wx.chooseImage({
sourceType: ['album', 'camera'],
sizeType: ['original'],
count: 1,
success: function (res) {
var tempFilePaths = res.tempFilePaths;
// 获取文件路径
var filePath = tempFilePaths[0];
// 1. 绘制图片至canvas
canvas.drawImage(filePath, 0, 0, 300, 200)
// 绘制完成后执行回调，API 1.7.0
canvas.draw(false, function(res){
// 2. 获取图像数据， API 1.9.0
wx.canvasGetImageData({
canvasId: canvasID,
x: 0,
y: 0,
width: 300,
height: 200,
success(res) {
// 3. png编码
let pngData = upng.encode([res.data.buffer], res.width, res.height)
// 4. base64编码
let base64 = wx.arrayBufferToBase64(pngData)
// ...
that.setData({
imgbase64: base64
})
}
})
})
}
})
}
5. 实现
need-to-insert-img
need-to-insert-img
tips
画布画的图片的长和宽是固定的，这个按照自己需求设置。
可以通过小程序的
wx.getImageInfo(OBJECT)
获取长和宽
相关链接
upng.js:
wx-cardscanner: 有时候会遇到后端需要前端获取的图片文件转换成base64，在传给后台
小程序有专门的选择图片接口，
但是这个只是返回一个图片的临时路径，并不是文件数据本身。
小程序暂时没有接口直接转base64的
所以我们需要使用canvas和canvasGetImageData（小程序版本1.9.0以后要才有）先获取图片内容，
再通过插件upng.js插件实现图片转base64（所需插件文件附件中）
1. 把upng.js和pako.min.js文件放到项目中
2. 在pages下的页面js文件中导入
var upng = require('../../utils/upng.js');
这里只需要导入npng.js ，pako.min.js是在npng,js里面调用
3. 建一个canvas
chooseImage"人脸测试
// 画布
// 生成base64位图片展示 变量imgbase64
4. 添加js点击chooseImage事件
chooseImage: function() {
var that = this;
var coss_signature = wx.getStorageSync('cos_signature');
var canvasID = "imgCanvas";
var canvas = wx.createCanvasContext(canvasID)
wx.chooseImage({
sourceType: ['album', 'camera'],
sizeType: ['original'],
count: 1,
success: function (res) {
var tempFilePaths = res.tempFilePaths;
// 获取文件路径
var filePath = tempFilePaths[0];
// 1. 绘制图片至canvas
canvas.drawImage(filePath, 0, 0, 300, 200)
// 绘制完成后执行回调，API 1.7.0
canvas.draw(false, function(res){
// 2. 获取图像数据， API 1.9.0
wx.canvasGetImageData({
canvasId: canvasID,
x: 0,
y: 0,
width: 300,
height: 200,
success(res) {
// 3. png编码
let pngData = upng.encode([res.data.buffer], res.width, res.height)
// 4. base64编码
let base64 = wx.arrayBufferToBase64(pngData)
// ...
that.setData({
imgbase64: base64
})
}
})
})
}
})
}
5. 实现
tips
画布画的图片的长和宽是固定的，这个按照自己需求设置。
可以通过小程序的
获取长和宽
相关链接
upng.js:
wx-cardscanner:
微信小程序外部js执行自动调用某些代码
这个简单，主要要使用 小程序的生命周期函数，然后利用模块化加载得方式，将外部js引入，在不同的生命周期阶段调用即可。
怎样用js开发微信小程序
微信小程序之js
如果你想开发一款微信小程序学会微信小程序的js是必须要精通的，只要你html+css+js的基础打的好在来全力的学习微信小程序js，之后在前端开发上就没有什么问题了，但是微信js是需要花精力去学习的，可以买一本参考书或者了解下微信小程序的api都是可以快速的帮助你介入开发的队列。
京公网安备 11010802041100号