vue根据路由ID获取数据,设置html数据
1、在右路中跳转设置参数<router-link :to="{path: 'PhoneParticular', query: { id: phone.id}}"><img :src="phone.image[0].image1"/></router-link>`2、引入全部数据,在被跳转到的vue页面,获取路由地址id。impor...
·
1、在右路中跳转设置参数
<router-link :to="{path: 'PhoneParticular', query: { id: phone.id }}">
<img :src="phone.image[0].image1"/>
</router-link>`
2、引入全部数据,在被跳转到的vue页面,获取路由地址id。
import phonedata from '../lib/shoppingPhoneData'
data (){
return{
phonedata,
id : this.$route.query.id,
item:[]
}
},
3、在全部数据(phonedata)中找到与id对应的数据,页面一加载就执行mounted()函数
mounted(){
for(var i=0;i<phonedata.length;i++){
if(phonedata[i].id==this.id){
this.item=phonedata[i]
}
}
}
4、在html中使用对应的数据
<div class="price-main">
<div class="fontMin floatL price-title">价格</div>
<div class="floatL price-count">
<span>¥</span>{{item.price}}
</div>
</div>
更多推荐
已为社区贡献4条内容
所有评论(0)