template/body部分:
<img :src="require('@/assets/'+ this.img1 +'.png')" alt="" />
ps.要用到的图片url为:src/assets/pf1.png (从pf1到pf9)
script标签部分:( 别忘了调用getPhoto() )
data(){
return{
id:'',
img1:''
}
},
methods:{
getPhoto(){
var that =this;
that.$axios({
url: '',
method: "get",
params:{id:that.id}
}).then(r => {
that.img1 = r.data[0].img;
}).then(err =>console.log(err))
}
}
数据库部分:这里img直接存 “pf1” 到 “pf9” 就行了
{
"id": "张三",
"img": "pf6"
}
最终效果就是,当data中的id变化时,其对应的图片也会跟着变化