小程序经验
Posted taiyang2014
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了小程序经验相关的知识，希望对你有一定的参考价值。
1:在app.json中配置page之后保存就可直接生成wxml,wxss,js,json文件
2:引入文件的方法:
引入 css 文件 : @import "../template/tabbar.wxss";
js引入js : import js from ‘../../js/js.js’ || var js = require(‘../../js/js.js‘)
xml 引入xml <import src = ‘../wxml.wxml’
3: 计算文字的长度
text.length * textSize
4:快捷键
1: opt + shift + f : 代码格式化
2: cmd + [, cmd+ ]代码行缩进
3: cmd + shift + [, cmd + shift +] 折叠打开代码块
4: cmd + /shift + return 在当前行的 上方/下方 插入一行
5: shift + alt + up/dow, 向上向下复制一行
6: alt + up/dow 上下移动一行
7: cmd + i 选中当前行
8: cmd + s保存
9: cmd + return 移动到文件结尾
5:定时执行
setInterval(this.run, 1000)6:注意
App() 必须在 app.js 中注册，且不能注册多个。
不要在定义于 App() 内的函数中调用 getApp() ，使用 this 就可以拿到 app 实例。
不要在 onLaunch 的时候调用 getCurrentPage()，此时 page 还没有生成。
通过 getApp() 获取实例之后，不要私自调用生命周期函数。
注意json文件不可添加任何注释。
7: 获取页面栈
用：getCurrentPages() 可以拿到页面栈，第一个元素为首页，最后一个元素为当前页面。
8: 播放音乐
wx.playBackgroundAudio({
dataUrl: data.songs[0].mp3Url,
title: data.songs[0].name,
coverImgUrl: data.songs[0].album.blurPicUrl
})
9:javascript 中的相等性判断
一: 参数传值的方法
1: data-id
我们可以给html元素添加data-*属性来传递我们需要的值,使用方法说明:
(1)设置data-id
|
1
|
<view class="block" bindtap="playTap" data-id="{{modle.id}}">
|
(2): 取值 + 传值?
|
1
2
3
4
5
6
7
|
playTap:function(e) {
const dataset = e.currentTarget.dataset;
wx.navigateTo({
url: ‘../play/index?id=‘+ dataset.id
})
console.log(dataset.id);
}
|
(3):取值
|
1
2
3
4
5
6
|
onLoad:function (param) {
//页面初始化
this.setData({
currentId:param.id
})
}
|
data-*注意事项:data-*名称不能有大写字母,曾经我就因为大写了一个字母,找了半天的才发现这个错误
..data-*属性中不可以存放对象
..data-*属性中不可以存放对象2: 设置id 的方法标识来传值
使用方法说明:
(1)设置id
|
1
|
<view bindtap=“playTap" id="{{modle.id}}">
|
(2)取值
通过e.currentTarget.id获取设置的id的值,然后通过设置全局对象的方式来传递数值
3: 在navigator中添加参数传值
使用方法说明
(1)传值:在navigator的属性url后拼接?id(参数名字)=要传递的值 (如果多个参数用&分开 &name=value&.......)
|
1
|
<navigator url="../my/my?id={{item.id}}" wx:for="{{modles}}">
|
(2)取值:
|
1
2
3
4
|
onLoad (params){
app.fetch(API.detail + params.id,(err,data) => {
})
}
|
数据请求封装
1.将所有的接口放在统一的js文件中并导出
|
1
2
3
4
5
6
7
|
const api = {
interface1: ‘https://........‘,
interface2: ‘https://.......‘,
interface3: ‘https://....‘,
.....
}
module.exports = api;
|
2:在app.js中创建封装请求数据的方法
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
|
fetch(url,data, callback) {
wx.request({
url,
data: data,
header: {
‘Content-Type‘: ‘application/json‘
},
success(res) {
callback(null, res.data);
},
fail(e) {
callback(e);
}
})
},
|
3: 在子页面中调用封装的方法请求数据
|
01
02
03
04
05
06
07
08
09
10
11
|
import API from "../../api/api.js";
const app = getApp();
const conf = {
data:{
title:‘正在拼命加载中...‘,
loadding:true
},
onLoad (){
app.fetch(API.hot,{},(err,data) => {
})
},
|