本文环境：windows7、vue2.9.6，该方法适用于所有品牌的电脑。
vue.js渲染背景图的方法：
带参数传值
本地美食
<template>
<div>
<h1>美食</h1>
<table border="1">
<tr>
<td>美食</td>
<td>美食图片</td>
<td>美食价格</td>
</tr>
<tr v-for="i in footlist">
<td>{{i.name}}</td>
<td><img :src="i.img" height="100" width="100"></td> // 渲染本地图片
<td>{{i.price}}</td>
</tr>
</table>
</div>
</template>
<script>
export default {
name: "foot",
data: function () {
return {
footlist: [] //初始化列表
}
},
mounted() {
var aa = this.$route.params.id; //获取上个页面带过来的参数
this.axios({
url: '/api/app/foot/', //api 是跨越时设置的 app是路由分发 foot是后端的接口
data: {aa:aa}, //向后端传递参数
method: 'post' //post方式
}).then((res) => {
if (res.data.code == 200) { // code == 200时
this.footlist = res.data.message; // 初始化赋值
console.log(res)
}
})
}
}
</script>
<style scoped>以上就是vue.js怎么渲染背景图的详细内容，更多请关注易知道|edz.cc其它相关文章！
