// 帶參數傳值
<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>
</style>