极客观点
项目管理
HarmonyOS
我从后台获取了数据以后 使用v-for 去循环列表 item就是 in前面的那个变量 明明有数据，列表也可以渲染出来 但是一直报错 说item没有在data里声明 这是为什么呢 v-for的 in前面的变量不需要声明啊
下面的status也是 明明返回的数据里有status 还是报undefined
这可能是什么原因造成的呢 愁死了 解决不了这个问题
div v-if="sanDetail" class="prot" v-for="item in totalPage">
<div class="prot_h">
<h1>{{item.name}}</h1>
<img src="../../../assets/images/invest/tuij.jpg" height="26" width="74" alt="">
</div>
<div class="details clearfix">
<div class="interest">
<p v-if="item.status != 2 && item.activityRate <= 0">
<big>{{item.repayRate.toFixed(2)}}</big>%
</p>
<p
class="rate"
v-if="item.status == 2 && item.activityRate > 0"
>
<big>{{item.repayRate.toFixed(2)}}</big> %
</p>
<p
class="rate"
v-if="item.status == 2 && item.activityRate <= 0"
>
<big>{{item.repayRate.toFixed(2)}}</big>%
</p>
<p
v-if="item.status != 2 && item.activityRate > 0"
>
<big>{{item.repayRate.toFixed(2)}}</big>%
</p>
<span>预期年化收益</span>
</div>
<div class="date">
<p
v-if="item.status == 2 && item.periodUnit == 0">
<big class="big">{{item.period}}</big>天
</p>
<p v-if="item.status == 2 && item.periodUnit == 1">
<big class="big">{{item.period}}</big>个月
</p>
<p v-if="item.status == 2 && item.periodUnit == 2">
<big class="big">{{item.period}}</big>年
</p>
<!---->
<p
v-if="item.status != 2 && item.periodUnit == 0">
<big>{{item.period}}</big>天
</p>
<p v-if="item.status != 2 && item.periodUnit == 1">
<big>{{item.period}}</big>个月
</p>
<p v-if="item.status != 2 && item.periodUnit == 2">
<big>{{item.period}}</big>年
</p>
<span>投资期限</span>
</div>
<div class="total">
<p><big>{{item.releaseAmount}}</big>元</p>
<span>产品总额</span>
</div>
<div class="percentage">
<div :data-value="percent"></div>
</div>
<router-link
to="invest/detail"
v-if="item.status == 2">
立即投资
</router-link>
<router-link
to="invest/detail"
v-if="item.status == 3"
class="btn"
>
已投满
</router-link>
<router-link
to="invest/detail"
v-if="item.status == 4"
class="btn"
>
还款中
</router-link>
<router-link
to="invest/detail"
v-if="item.status == 5"
class="btn"
>
已完成
</router-link>
</div></div>
........export default.......
export default {
data() {
return {
idx: 0,
currentIndex: '',
productCategories: [],
sanDetail: [],
zhaiDetail: [],
percent: '',
totalPageCount: 0,// 总页数
pageSize: 5, // 每页显示5条数据
totalPage: [], //所有数据
allData: 0 // 所有数据条数
}
},
created() {
// 初始化
storageUtil.set("tab", "散标")
this.getSanDetail()
// 获取产品分类
product.getProductCategory().then((res) => {
let productCategoryId = Number(urlUtil.getUrlArgObject().productCategoryId)
if(isNaN(productCategoryId)) {
productCategoryId = 0
}
this.productCategories = res.data
this.productCategories.unshift('')
})
},
methods: {
// 理财专区和债转专区切换
tabSwitch(index,evt) {
this.idx = index
if(this.idx == 0) {
storageUtil.set('tab', '散标')
this.historyProductId('SanCategoryId', evt)
}else if(this.idx == 1) {
storageUtil.set('tab', '债权转让')
this.historyProductId('ZhaiCategoryId', evt)
}
},
// 产品分类留痕
historyProductId(id,ev) {
let categoryId = storageUtil.get(id)
if(categoryId != null) {
ev.target.setAttribute('data-id',categoryId)
}
},
// 选择产品分类
selectProduct(index,evt) {
this.currentIndex = index
let productCategoryId = evt.target.getAttribute('data-id')
storageUtil.get('tab') == '散标' ?
storageUtil.set('SanCategoryId', productCategoryId) :
storageUtil.set('ZhaiCategoryId', productCategoryId)
this.getSanDetail()
},
// 获取散标数据
getSanDetail() {
let productCategoryId = storageUtil.get('SanCategoryId') != null ? storageUtil.get('SanCategoryId') : 0
product.getProductList(productCategoryId).then((res) => {
console.log(res)
this.sanDetail = res.data.list
this.allData = res.data.list.length
// 计算总页数
this.totalPageCount = this.allData % this.pageSize != 0
? parseInt(this.allData / this.pageSize) + 1
: parseInt(this.allData / this.pageSize);
this.pageTurning()
for(let i = 0; i < this.sanDetail.length; i++) {
let str = this.sanDetail[i].amountNow /
this.sanDetail[i].releaseAmount * 100 +''
if(this.sanDetail[i].status == 2) {
if(str.indexOf('.') > 0) {
this.percent = Number(str) < 1 ? '1' : Math.floor(str) + ''
}else {
this.percent = str + '';
}
}else {
this.percent = '100'
}
}
})
},
// 获取债权转让数据
getTransferList() {
let productCategoryId = storageUtil.get('ZhaiCategoryId') != null ? storageUtil.get('ZhaiCategoryId') : 0
product.getTransferrAcceptanceList(productCategoryId).then((res) => {
this.zhaiDetail = res.data.list
for(let i = 0; i < this.zhaiDetail.length; i++) {
let str = this.zhaiDetail[i].cuAmount /
this.zhaiDetail[i].releaseAmount * 100 +''
if(this.zhaiDetail[i].status == 2) {
if(str.indexOf('.') > 0) {
this.percent = Number(str) < 1 ? '1' : Math.floor(str) + ''
}else {
this.percent = str + '';
}
}else {
this.percent = '100'
}
}
})
},
// 分页
pageTurning() {
if(this.totalPageCount > 1) {
this.totalPage = this.sanDetail.slice(0, this.pageSize)
}else {
this.totalPage = this.sanDetail
}
},
changePage(index) {
let _start = ( index - 1 ) * this.pageSize;
let _end = index * this.pageSize;
this.totalPage = this.sanDetail.slice(_start, _end)
}
},
components: {
Page
}}
返回的数据有，不代表你已经声明了
vfor那个问题你要看文档
vfor