新手小程序看看

小程序的语法跟 vue 的语法格式很像  里面标签很简单 就重复那几个 

1 页面布局 - 优先选取flex布局(可以看看阮一峰的博客讲的很详细)

2 由于是前后端分离,所以提前根据接口文档返回参数,进行数据模拟(mock.js)

3 工具函数的封装 例如 请求接口的函数  等多次调用的函数 (Promise)

4 后端返回的数据处理(如果提前沟通好了可以省很多时间)

5 项目需求的确定 不要根据自己的想法写,不然后期会不停返工 ***

6 代码优化,一定要考虑性能方面的问题,像 this.setData({})最好在一次里面赋值

// fetch.js  

module.exports = (url, data) => {   return new Promise((resolve, reject) => { wx.request({  url: `xxxxxx${url}`, method: 'POST',  data: data, header: { "content-type": 'application/x-www-form-urlencoded'}, success: resolve, fail: reject})}) 

在页面中导入 const fetch = require('../../utils/fetch.js')

fetch('url',{}).then(res => {console.log(res.data}) 

如果需要继续调用只需要 return 一下就可以 

//  token 的获取  
调取微信登录方法=> 获取code值 => 根据需求传递参数调取登录接口=> 获取token存入全局变量中(在globalData中定义全局变量token)=>app.globalData.token = res.data.token=>然后在每个页面就可以调用了。(公用的数据都可以存在globalData中)
 
// formId 的获取 
//与用户发生交互获取formId   必须设置 report-submit='true' 
<form bindsubmit="formSubmit" report-submit='true'>
<button
form-type='submit'
></button>
</form>
//绑定事件 只有在真机上测试才有值  
formSubmit: function (e) {
app.globalData.formId = e.detail.formId;
},
 
还有就是小程序的跳转方式要注意  可以重点看看navigateTo 和 navigator   redirect  的区别
 
其它的不懂的可以查阅小程序官方文档,比较详细。  
 
就先这样吧,第一篇随便写写,以后慢慢上干货吧。
 
 
 
 

猜你喜欢

转载自www.cnblogs.com/alenhx/p/8969470.html