在小程序中使用iconfont(阿里巴巴矢量图标库)
我们在小程序开发的时候,想使用iconfont是一个相当痛苦的过程。而且在开发阶段,需要频繁更新图标,一旦更新图标,需要做大量重复的工作。
mini-program-iconfont-cli
使用该项目,可以快速的把我们iconfont上的图标引入小程序当中。
现在支持以下小程序
- 微信小程序
- 支付宝小程序
- 百度小程序
- 头条小程序(字节跳动
- 快手小程序
- QQ小程序
鸟则择木,木岂能择鸟?
我们在小程序开发的时候,想使用iconfont是一个相当痛苦的过程。而且在开发阶段,需要频繁更新图标,一旦更新图标,需要做大量重复的工作。
使用该项目,可以快速的把我们iconfont上的图标引入小程序当中。
现在支持以下小程序
wxs是小程序的一种脚本语言,语法基本跟JS是一致的,不过还是有一些区别。
wxs是解决什么问题的呢?比如我们要过滤后台接口给我们的一些字符串,但是在wxml里面使用{{}}是不能直接用js来进行过滤的。如果我们在js里面单独过滤后赋值给页面,数据多了也不是很方便。wxs就是为了解决这个问题产生的。
我们可以在自己的公用方法里面建立自己的wxs脚本
function filterStrN(str){
var reg = getRegExp('\n', 'g');
return str.replace(reg,'')
}
module.exports = {
filterStrN : filterStrN
}
以上脚本是过滤字符串的n换行符的。
这里需要注意一点。在使用replace进行正则替换的时候,如果写成replace(/n/g, '')这样是无法通过编译的。所以正则我们必须要单独使用getRegExp来生成;
建立好文件以后,在需要使用的wxml文件里面,引入脚本
<wxs src="../../../../public/wxs/filterStr/filterStr.wxs" module="filterStrN" />
需要使用的地方直接使用
{{filterStrN.filterStrN(str)}}
这样就可以直接使用了
在做小程序的时候,经常会遇到在其他页面修改当前表单页面值的情况。(个人觉得这种表单页面需要跳转到其他页面填写的方法十分繁琐,但是产品要,没办法)当时想到的办法是在URL里面跳转的时候用key:value的形式来进行传参,但是在返回上一页的时候,调用的生命周期是onShow的方法。查看了官方文档,onShow方法是没办法从url接收到参数的。那么我又想到了一个方法,用storage来进行传参。但是这个方法也是比较笨的方法,使用多了会造成storage的混乱,不利于数据维护。那么我们有没有办法进行优雅的跨页面传参呢?
当当当当!
官方有一个API是getCurrentPages,可以获取页面栈的所有信息。它的长度代表了当前是第几个栈,而且我们可以直接修改某个栈的数据。相信这里有很多童鞋已经明白了。
let pages = getCurrentPages(); //获取所有推宅
let prevPage = pages[pages.length - 2]; //上一个页面
// 获取上一个页面的值
let rData = prevPage.data.addData;
//设置上一个页面的data的值
rData.jobName = e.currentTarget.dataset.value
prevPage.setData({
addData: rData
}, function () {
wx.navigateBack()
});
一定要注意的是,redirectTo和navigateTo方法返回到指定页面,会造成数据清空的情况,所以这里要用navigateBack方法返回上一页。
在使用Vant的小程序UI组件时,发现官方自带的Dialog组件确认按钮与取消按钮样式不正确。按钮整体靠右移动,导致视觉上面看起来按钮位置不居中。