小程式同一頁面賦值Jso的資料並顯示出來(完美案例)
目的:載入Api返回的Post的Json資料,並顯示在介面表示出來。打通資料庫到小程式到介面對應顯示出來。
困難:
1.在Data中的資料如何在頁面載入是賦值替換?
2.提供post的Data值還沒有設定變數
<view class='mingpian' wx:for="{{arr}}" style="transform:translate(10px, 10px);" >
<image class='images'src="{{item.Photo}}"></image>
<view class='name'>{{item.Name}} <view class='position'>{{item.Position}}</view></view>
<view class='company'>{{item.Company}}</view>
</view>
///////////////////////
var that = this;
wx.request({
url: 'http://localhost:40637/api/values/',
data: {
Id: 1,
Name: 'xiaohong'
},
method: "POST",
dataType: JSON,
success: function (res) {
console.log(JSON.parse(res.data));
var value = JSON.parse(res.data);
that.setData({
arr:value
})
},
})
//////////////////////////////////////
.mingpian{
display: flex;
align-items:center;
justify-content:left;
width: 100%;
height: 100%;
}
.images
{
width: 60px;
height: 60px
}
.name
{
font-size: 20px;
}
.position
{
font-size: 15px;
}
.company
{
font-size: 16px;
}
配合案例使用:https://download.csdn.net/download/weixin_42401291/10775476