1,快速建立小程序文件夹文件(js/json/wxml/wxss)
一开始在编辑器上右键,一个一个建这4个文件;
后来,选择在硬盘打开,直接拷贝其他文件夹,然后改名;
直到某天网上无意发现一篇文章,原来你可以在app.json中使用一行代码添加4个文件。
如图:只要在app.json的pages里面添加一行新的路径,开发者工具就会自动创建该路径以及配套的4个文件(js里还贴心准备各种事件响应代码)
就是这么神奇!对我这种新手来说,太方便了!
PS:当时网上发现的那篇文章地址 http://www.wxapp-union.com/forum.php?mod=viewthread&tid=1656
2,小程序页面不能分享
打开小程序,发现点右上角的功能键(3个点)后,底部提示“当前页面不可转发”。
我一度以为是小程序首页(index)不支持分享转发,直到不小心在js里添加了下面这行事件代码:
/** * 用户点击右上角分享 */
onShareAppMessage: function () {
}
原来js里是要有分享事件才能出现转发!我自己之前各种改代码,js里没了分享事件,所以页面就不能分享转发了。
PS:这个事件里还可以设置转发的页面名称、图片、URL参数等。
3,设置小程序顶部选项卡(TAB)
很多微信小程序顶部都是好几个选项卡,可以点击切换,这个实现起来也很容易。
在app.json中,直接添加下面这行代码即可。
"tabBar": {
"color": "black",
"borderStyle": "white",
"selectedColor": "rgb(176,170,168)",
"backgroundColor": "white",
"list": [
{
"pagePath": "pages/index/index",
"text": "底部TAB1",
"iconPath": "images/tabBar/tab1_unsel.png",
"selectedIconPath": "images/tabBar/tab1_sel.png"
},
{
"pagePath": "pages/usercenter/usercenter",
"text": "底部TAB2",
"iconPath": "images/tabBar/tab2_unsel.png",
"selectedIconPath": "images/tabBar/tab2_sel.png"
}
]
},
可以很方便设置底部选项卡的颜色、边框、ICON图标(选择前&选择后)、名称、跳转路径(需要在pages集合中已添加的路径)等。
4,为什么代码里一些地方要用that.setData({})而不是this.setData({})
首先that是需要提前定义的一个变量名,你也可以叫别的。
this在一些地方,代表的含义是不同的,举例如下:
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
let that = this;
wx.request({
url: "https://你的后端域名/api/get_xxx",
header: {
"Content-Type": "application/json"
},
success: function (res) {
//this.setData({}) 此时不能用this设置整个page页面的data值,因为此时this的上下文作用域是里层事件,不再是page页。
that.setData({
num1: res.code //随便的一个页面data定义
});
}
});
},
也就是说,主要是因为作用域的变化,在里层事件里,this已不能获取整个page的data信息,所以才在外层事件的开始给起个别名,以便后面调用设置page页面的data数据等。
5,在js里获取wxml页面textarea控件的输入值
比如说下面的textarea,绑定了一个input输入事件,方法名字叫searche_txt,
<textarea bindinput='search_txt' focus='{{true}}' value="{{from_content}}" placeholder="输入文字" style="height: 7.3em" />
在js代码中,增加这个方法:
search_txt: function (res) {
this.setData({
search_content: res.detail.value,
})
},
这样就能实现在page页面的data中一直更新存储页面输入框的值,在和接口交互时,可以直接使用page页面的data值,不用再考虑前端控件输入值的取得。
放上示例小程序供参考。
工具类小程序示例TODO 暂时先写到这里,会陆续添加。
网友评论