问为什么我setdata中的数组p1前端没显示？

const db = wx.cloud.database({});

const cont = db.collection(' hero');

Page({

/**

* 页面的初始数据

*/

data: {

p: [],

p1: []

},

/**

* 生命周期函数--监听页面加载

*/

onLoad: function (options) {

db.collection('hero').get({

success: res => {

this.setData({

p: res.data

})

// console.log(res.data[0].herotype)

// var pp = this.data.p

// const length = pp.length

var id = parseInt(options.role)

console.log(id)

for(let i=0;i<=res.data.length;i++){

// console.log(res.data.length)

if(id==res.data[i].herotype){

this.setData({

p1: res.data[i]

})

}

}

}

}) }

<view class='big'>

<view class='list' wx:for="{{p1}}">

<image class='list-img' src='{{item.img}}'></image>

<view class='pro-body'>

<view class='list-item1'>{{item.ename}}</view>

<view class='list-item1'>{{item.name}}</view>

</view>

</view>

</view>