上转链接

或者

因为上一篇教程目录过长，十分影响继续编辑，于是在此继续开坑，接下里的目录将会发布在此处。

目录

1.uni-app渲染用户中心数据
2.uni创建阅读页面
3.WordPress编写阅读文章API接口

技术援助

教程看不懂？需要一对一技术援助服务？点击这里

使用旧版可以，新版就不行，由于是之前人的代码也不是特别熟悉，头疼啊这咋整

多年混合app开发经验，weex、uni-app、ionic、RN、原生开发、flutter熟练使用，上架程序两位数，有丰富的上架经验，付费咨询解答
团队后端有PHP JAVA GO。
ps：团队15人 并非个人开发者。
联系QQ 1410323850 微信同QQ

案例集合

1. 钉单 应用地址：钉单 （电商类）
2. 返利快报 应用地址：好利快报（淘宝客 电商类）
3. 下单接龙 微信小程序搜索：下单接龙 （团购电商类）
4. 尾巴生活 微信小程序搜索：尾巴生活 （电商类）
5. 随心购物 微信小程序搜索：随心购物（电商类）
6. 宠物领养送养平台 微信小程序搜索：宠物领养送养平台 （社交类）
7. 爱美蛙淘 微信小程序搜素：爱美蛙淘（电商类）
8. 步步生金 应用地址 步步生金 （电商类）
9. 喵赞（迭代更新）主页地址 喵赞主页 （分销推广类）
10. 地图派对 微信小程序搜索：地图派对 （地图导航类）
    11.宠益领养联盟 微信小程序搜索：宠益领养联盟 （宠物活体领养）
    12.慢慢霆优商城：
    用户端 安卓地址：http://app.xiaomi.com/details?id=com.sctingyou.app
    用户端 苹果地址：https://apps.apple.com/cn/app/id1409392292
    商家端 苹果地址：https://apps.apple.com/cn/app/id1409408555
    13.恋练yoga:
    ios商店地址：https://apps.apple.com/cn/app/id1103167076
    安卓地址：http://www.yujia.com/Public/lianl/

7月1日起，苹果App Store审核要求应用不能使用启动图片，必须更新使用Storyboard来制作启动界面，来保证应用适配不同屏幕尺寸和比例的iPhone设备。详情参考：Deadline for App Updates Has Been Extended
也就是说之前针对不同iPhone设备配置对应分辨率启动图片已经被苹果官方废弃，使用启动图片的应用将不能通过App Store审核。

什么是Storyboard

Storyboard是Apple提供的一种简化的布局界面，通过xml描述界面，不能编程。
虽然无法制作非常灵活的界面，但满足启动界面是没问题的，比如设定背景色背景图、设定前景文字、图片的位置。
storyboard的优势是启动速度快。在App的真实首页被渲染完成前，可以快速给用户提供一个基于Storyboard的启动屏。

其实5+App、wap2app、uni-app在iOS上，已经在两种情况下使用了Storyboard：

• 如果在manifest里没有选择自定义启动图片，那么默认情况下，打包后App启动时，会出现一个显示着app logo和name的通用启动界面。在iOS上，其实这个界面就是使用Storyboard实现的。
• 如果你的App启用了uni-AD广告服务，那么开屏广告界面，iOS上也是基于Storyboard实现的。

6月30日起，如上线Appstore，iOS只能使用Storyboard做启动图。如果你不想自己做Storyboard文件，就选择上述2种方式。
如果想自定义Storyboard，那么从HBuilderX 2.8起，也提供了自定义storyboard的方式。

HBuilderX2.7.*及以下版本

在项目的manifest.json文件中不配置启动图片，默认情况下，云端打包后App启动时，会出现一个显示着app logo和name的通用启动界面。在iOS平台这个界面就是使用Storyboard实现的。
启动界面效果参考：https://ask.dcloud.net.cn/article/37474

HBuilderX2.8+版本

可以继续使用通用启动界面，还新增支持配置自定义storyboard启动界面，详情参考：https://ask.dcloud.net.cn/article/37475

和同事一起合作一个APP，有段时间运行到iPhone 有时候会显示error的页面 有时候控制台会报错iPhone显示空白 最近又显示无法独立运行，但是运行到Android又没问题

因为一直在提交新内容，所以没有解决，直到昨天花了将近一上午的时间，找到了问题所在

我们这边的原因是：另一个同事提交图片的名称是中文

庆幸不是大问题，但这也着实有点坑了

1、关于oppo手机收不到消息的问题

2、关于华为手机离线推送厂商渠道失败的问题
你会说，明明我的华为推送都设置好了，为什么不行，别慌，那一定是配置有问题；
划重点：华为平台创建PUSH权益的时候，sha256指纹证书需要填写上，并且华为推送测试需要使用自有证书打包；（华为渠道有sha256指纹证书检验）。
华为平台sha256指纹证书填写如图：

3、上传iOS证书提示“证书环境错误的问题？
导证书不要把钥匙串也导进来,记得是推送证书，不是打包证书，两个不要搞混了。

4、关于推送的监听问题
推送的消息分为两种 ，1：通知消息 2：透传消息
（1）通知消息的推送 ，会在消息中心显示，点击通知启动（激活）应用到前台运行，触发“click”事件。

（2）透传数据的推送，可以响应click和receive。
1.发送透传数据的格式是标准格式（{title:"通知标题",content:"通知内容",payload:"通知测试"}），会在消息中心展示，并且这个时候当用户点击这个消息，就会响应click事件，只能响应click事件。
2.发送的透传数据不是标准格式并且当前应用在活动，同时满足这些条件，才可以响应receive事件，并且不会在消息中心展示。
总结为：
触发click事件： 发送透传数据并且格式为标准格式，会在消息中心展示。
触发receive事件：发送透传数据且格式为非标准格式且应用在活动，不会在消息状态栏显示。
ios:
在线：只能响应receive，不会在系统消息中心显示推送通知。
离线：使用苹果APNS通道下发推送通知，手机接收后在系统通知栏中显示，点击消息后启动应用（如果已经启动则从后台切换到前台），同时触发“click”事件。
Android：
在线（个推推送通道可用）：推送通知和透传消息都使用个推的推送通道下发推送消息。
离线（个推推送通道不可用）：如果符合厂商推送的厂商手机（配置了手机厂商推送参数并且在对应厂商的手机上），则使用厂商推送通道下发推送消息；否则使用个推的离线推送通道，离线消息会存储在消息离线库，离线时间内APP在线后下发推送消息。

实现思想：主动滚动一段距离，截一个图，然后裁剪拼接

必备插件：QS-SharePoster

关键步骤：

1.截长图准备

2.截取图片组

3.拼接长图片

1.截长图准备 preparePicture()

获取屏幕可用宽高，页面宽高，及页面底部位置

// 在这之前隐藏无用的模块和元素  
setTimeout(function() {  
    _this.$nextTick(function() {  
        uni.getSystemInfo({  
            success: function(res) {  
                let sh = res.screenHeight;  
                let sw = res.screenWidth;  
                let wh = res.windowHeight;  
                let ww = res.windowWidth;  
                _this.screenHeight = wh;  
                _this.screenWidth = ww;  
                let info = uni.createSelectorQuery().in(_this);  
                info.select('.page').boundingClientRect(function(data) {  
                    _this.pageHeight = data.height;  
                    _this.pageWidth = data.width;  
                    _this.pageBottom = data.bottom;  
                }).exec();  
            }  
        });  
    });  
}, 100);  
// 紧接着开始滚动截图  
setTimeout(function() {  
    _this.getPicture();  
}, 300);

2.截取图片组 getPicture()

滚动到指定位置，截取和保存图片。

滚动等待：scrollPicture(top)

let _this = this;  
return new Promise(function(resolve, rejcet) {  
    uni.pageScrollTo({  
        scrollTop: top,  
        duration: 10,  
        complete: function() {  
            setTimeout(function() {  
                resolve();  
            }, 300);  
        },  
        fail: function() {  
            reject();  
        }  
    });  
});

获取WebviewObject：getCWV()

let _this = this;  
return new Promise(function(resolve, reject) {  
    // let pages = getCurrentPages();  
    // let cwv = pages[pages.length - 1].$getAppWebview();  
    let cwv = _this.$scope.$getAppWebview();  
    cwv.checkRenderedContent(  
        {},  
        async function() {  
            const bmp = await savePage(cwv, 'cwv_' + _this.cwvArr.length, 0, _this.screenHeight);  
            _this.cwvArr.push(bmp);  
            resolve(cwv);  
        },  
        function() {  
            reject();  
        }  
        );  
});

获取每一个截图：getPicture()

try {  
    let _this = this;  
    let sh = this.screenHeight;  
        let sw = this.screenWidth;  
    let ph = this.pageHeight;  
    let pw = this.pageWidth;  
    let pb = this.pageBottom;  
    let bmpNum = Math.ceil(ph / sh);  
    for (let i = 0; i < bmpNum; i++) {  
        if (i == 0) {  
            console.log('第一页' + i);  
            await _this.scrollPicture(0);  
            let cwv = await _this.getCWV();  
            _this.bmpArr[i] = await cutPage(_this.cwvArr[i], 'bmp_' + i, 0, ph > sh ? sh : ph);  
        } else if (i == bmpNum - 1) {  
            console.log('最后一页' + i);  
            // await _this.scrollPicture( sh * i );  
            await _this.scrollPicture(ph);  
            let cwv = await _this.getCWV();  
            _this.bmpArr[i] = await cutPage(_this.cwvArr[i], 'bmp_' + i, (i + 1) * sh - ph, sh);  
        } else {  
            console.log('中间页' + i);  
            await _this.scrollPicture(sh * i);  
            let cwv = await _this.getCWV();  
            _this.bmpArr[i] = await cutPage(_this.cwvArr[i], 'bmp_' + i, 0, sh);  
        }  
    }  
    _this.makePicture(_this.bmpArr);  
} catch (e) {  
    await _this.scrollPicture(0);  
    this.$showToast('长图生成异常' + e);  
}

3.拼接长图片 makePicture(urlArr)

            try {  
                let _this = this;  
                let sh = this.screenHeight;  
                let sw = this.screenWidth;  
                let ph = this.pageHeight;  
                let pw = this.pageWidth;  
                let pb = this.pageBottom;  
                let bmpNum = Math.ceil(ph / sh);  
                let tmp = [];  
                for (let i = 0; i < bmpNum; i++) {  
                    if (i == 0) {  
                        tmp[i] = {  
                            type: 'image',  
                            id: i,  
                            url: urlArr[i],  
                            dx: 0,  
                            dy: 0,  
                            serialNum: i,  
                            dWidth: sw,  
                            dHeight: ph > sh ? sh : ph  
                        };  
                    } else if (i == bmpNum - 1) {  
                        tmp[i] = {  
                            type: 'image',  
                            id: i,  
                            url: urlArr[i],  
                            dx: 0,  
                            dy: i * sh,  
                            serialNum: i,  
                            dWidth: sw,  
                            dHeight: ph - i * sh  
                        };  
                    } else {  
                        tmp[i] = {  
                            type: 'image',  
                            id: i,  
                            url: urlArr[i],  
                            dx: 0,  
                            dy: i * sh,  
                            serialNum: i,  
                            dWidth: sw,  
                            dHeight: sh  
                        };  
                    }  
                }  
                this.imageArr = tmp;  
                console.log(this.imageArr);  
                try {  
                    _app.log('准备生成:' + new Date());  
                    const d = await getSharePoster({  
                        _this: _this, //若在组件中使用  
                        type: 'testShareType',  
                        formData: {  
                            //访问接口获取背景图携带自定义数据  
                        },  
                        // bbgh是底部图片高度  
                        background: {  
                            height: ph,  
                            width: sw  
                        },  
                        posterCanvasId: 'canvasId',  
                        delayTimeScale: 30, //延时系数  
                        setCanvasWH: ({ bgObj, type, bgScale }) => {  
                            _this.poster = bgObj;  
                        },  
                        drawArray({ bgObj, type, bgScale, setBgObj, getBgObj }) {  
                            return _this.imageArr;  
                        }  
                    });  
                    _app.log('海报生成成功, 时间:' + new Date() + '， 临时路径: ' + d.poster.tempFilePath);  
                    _this.tempFilePath = d.poster.tempFilePath;  
                    // uni.saveImageToPhotosAlbum({  
                    //  filePath: _this.tempFilePath,  
                    //  success(res) {  
                    //      _app.showToast('保存到相册成功');  
                    //  },  
                    //  fail() {  
                    //      _app.showToast('保存到相册失败');  
                    //  }  
                    // });  
                } catch (e) {  
                    console.log(JSON.stringify(e));  
                }  
                // 清除碎图片  
                for (let i = 0; i < bmpNum; i++) {  
                    let bmp = new plus.nativeObj.Bitmap('bmp_' + i, urlArr[i]);  
                    bmp.recycle();  
                    bmp.clear();  
                }  
            } catch (e) {  
                this.$showToast('保存长图异常' + e);  
            }

savePicture.js

export const savePage = function(wbv, id, starth, endh) {
return new Promise((resolve, reject) => {
try {
let sh = starth;
let eh = endh;
let filePath = _doc/${id}.png
let bmp = new plus.nativeObj.Bitmap(id, filePath);
wbv.draw(
bmp,
function() {
console.log('图片绘制成功' + sh + 'px' + eh + 'px');
// eh - sh + 'px'
bmp.save(
filePath, {
overwrite: true,
format: 'png',
quality: 100
},
function(e) {
console.log('保存图片成功');
console.log(bmp);
let target = e.target; // 保存后的图片url路径，以"file://"开头
let size = e.size; // 保存后图片的大小，单位为字节（Byte）
let width = e.width; // 保存后图片的实际宽度，单位为px
let height = e.height; // 保存后图片的实际高度，单位为px
console.log("width:"+width)
console.log("height:"+height)
// console.log(target)
// console.log(filePath)
resolve(target);
},
function(e) {
console.log('保存图片失败' + JSON.stringify(e));
}
);
},
function(e) {
console.log('图片绘制失败：' + JSON.stringify(e));
},
{
clip:{
top: sh + 'px',
left: '0px',
width: '100%',
height: eh - sh + 'px'
}
}
);
} catch (e) {
console.log('保存图片失败' + JSON.stringify(e));
reject(e);
}
})
}
export const cutPage = function(filePath, id, starth, endh) {
let sh = starth;
let eh = endh;
let bmp = new plus.nativeObj.Bitmap(id);
return new Promise((resolve, reject) => {
try {
// let bmp = new plus.nativeObj.Bitmap(id, filePath);
bmp.load(filePath, function() {
console.log('图片绘制成功' + sh + 'px' + eh + 'px');
bmp.save(
filePath, {
overwrite: true,
format: 'png',
quality: 100,
clip: {
top: sh + 'px',
left: '0px',
width: '100%',
height: eh - sh + 'px'
}
},
function(e) {
console.log('保存图片成功');
console.log(bmp);
let target = e.target; // 保存后的图片url路径，以"file://"开头
let size = e.size; // 保存后图片的大小，单位为字节（Byte）
let width = e.width; // 保存后图片的实际宽度，单位为px
let height = e.height; // 保存后图片的实际高度，单位为px
console.log("width:"+width)
console.log("height:"+height)
// console.log(target)
// console.log(filePath)
resolve(target);
},
function(e) {
console.log('保存图片失败' + JSON.stringify(e));
}
);
}, function(e) {
console.log('图片绘制失败' + JSON.stringify(e));
rejcet(e)
})
} catch (e) {
console.log('保存图片失败' + JSON.stringify(e));
reject(e);
}
})
}

贴的有点乱，有空再写第二个方案吧

HBuilderX 2.8.0+版本起，底部控制台，右键菜单，相关操作支持自定义快捷键

如下图所示：

如何自定义快捷键？

点击菜单【工具】【自定义快捷键】,将下列代码拷贝到【用户设置】中。

[  
  // 底部控制台: 清空控制台  
  {  
    "key": "ctrl+shift+1",  
    "command": "workbench.console.action.clearLog"  
  },  
  // 底部控制台: 锁定滚动条  
  {  
    "key": "ctrl+shift+2",  
    "command": "workbench.console.action.lock"  
  },  
  // 底部控制台: 全选  
  {  
    "key": "ctrl+shift+3",  
    "command": "workbench.console.action.selectAll"  
  },  
  // 底部控制台: 复制  
  {  
    "key": "ctrl+shift+4",  
    "command": "workbench.console.action.copy"  
  }  
]

个人接单，多年uni原生插件开发，原生sdk接入,iOS+Android。uni插件 5+插件，

QQ 956878253 欢迎骚扰~

该淘客项目基于uniapp nvue开发，体验可达到原生效果（目前市面上很多都是apiCloud 以及 uniapp vue开发的 体验不如nvue流畅），运行流畅。可上架IOS（我自己提交一次过审）
支持IOS13 apple登录、微信登录 获取本机手机号直接登录。

部分页面截图如下：

安卓以及IOS下载地址：https://m3w.cn/cst

付费出售，整包源码打包出售，淘客京东拼多多跟单使用python跟单。可实现1分钟内订单同步到数据库。

后台使用thinkphp5.1
客户端使用 uniapp for nvue
跟单使用python完成。
带 vue h5源码。（因为有部分H5活动页面）

价格 大于 一万。非诚勿扰。

记录一下，在小程序里使用 setTabBarItem 设置底部导航栏的文本， 只能tabbar的页面调用，否则无效

uni.setTabBarItem({  
          index: 2,  
          text: 'text'  
        })

在之前的版本中，参照着 https://ask.dcloud.net.cn/article/628 成功的将css代码修改成了一行，但某次更新后发现又不可以了，好像更新了 beautifier.js 版本
网上有很多写有方法修改的，但有些总是不尽人意，有些真是有些老的方法了
这次在标题中写明日期，注意看哈

先看效果：

```css  
@charset "utf-8";  
/* CSS Document */  
.help_nav {width: 970px;margin: auto;height: 30px;padding-top: 5px;line-height: 30px;color: #555555;}  
.help_nav label {color: #999999;}  
.main {width: 970px;margin: auto;}  
.list_l {width: 715px;float: left;border: 1px solid #dadada;margin-bottom: 20px;}
```  

解决方法：  

1..............................................................
工具 > 插件配置 > format > jsbeautifyrc.js
module.exports = {
parsers: {
...
},
options: {

    "css": {  
        "newline_between_rules": false,  
        "selector_separator_newline": false,  
        "preserve_newlines": false  
    }  

}
}

2..............................................................
修改文件：\HBuilderX\plugins\format\node_modules\js-beautify\js\src\css\beautifier.js
比较推荐的方法是注释掉
注释掉：
295行
298行
369行
代码都一样：this._output.add_new_line();

3..............................................................
先Ctrl + A 全选，再Ctrl + Shift + K将代码压缩成一行
再Ctrl + K 后查看效果

有什么疑问，下方留言喽