vue动态加载图片

如果是直接动态获取完整的图片地址可以使用以下方法

<template>
    <img :src="url">
</template>

<script>
    export default {
        data(){
             return {
                  url:'完整的图片地址'
              }
        }
    }
</script>
    

如果想动态的改变地址中的某个索引，必须使用require来加载图片，如下

<template>
    <img :src="require('../_img/f_touxb'+url+'.png')">
</template>

<script>
    export default {
        data(){
             return {
                  url:1
              }
        }，
        created(){
            this.randoms()
       },
       methods:{
            randoms(){
               this.url = Math.ceil(Math.random()*5)//随机生成1到5的数字
          }
       }
    }
</script>