小程序与后台数据交互
wx.request({
url:"", //接口地址
method："get|post", //请求方式
data:{id:1001}， //向后台传递的参数
header: { //设置请求头
'content-type': 'application/json' // 默认值
},
success:function(res) {}, //成功返回的数据
fail:function() {} //失败返回的数据
});
步骤“
1.小程序与后台交互是通过wx.request()交互的
2.需要在小程序后台面板设置：设置-》开发设置-》服务器域名-》request合法域名设置
注：请求后台格式为：https://
3.如果打开页面获取后台数据，需要在onload中使用wx.request()
例如：onLoad: function (options) {
let _this=this;
wx.request({
url:'https://zhige666.gitee.io/xcx/api/goods.json',
method:'get',
success:function(res) {
console.log("返回的结果：",res);
if(res.statusCode===200 && res.data.code===200) {
_this.setData({
list:res.data.content
});
}
}
})
},
注意：小程序不允许用wx.request()请求本地的json文件，必须放在线上
微信小程序常用标签
view:相当于div
text:相当于span
button: 按钮
image:图片标签 相当于img
......
显示/隐藏
通过两种方式显示隐藏
1. wx:if 相当于vue的v-if
2. hidden 相当于vue的 v-show反义
引入文件
1.引入公共样式文件
@import "wxss文件路径"
2.引入公共的模板文件(即wxml)
样式处理
两种方式：
1.style <view style="color:{{ index===currentIndex ? '#00f':'' }}">
2.class <view class="{{ index===currentIndex ? 'active':'' }}"></view>
数据改变并同步到视图（页面）上
this.setData({});
例如：
this.setData({
currentIndex:index
});
click: function (e) {
var id = e.target.id//根据点击不同的view获取对应的id值
var str = "isChecked[" + id + "]"//重点在这里，组合出一个字符串
this.setData({
[str] : false//用中括号把str括起来即可
})
}