在vue中使用拼接圖片時，會出現圖片無法識別的情況

<img :src="item=='seat' ? '../../statices/img/text1.png' : ' ../../statices/img/text2.png' " />

此時圖片有可能無法識別，需要將圖片單獨引入。

首先給圖片地址繫結變數

<template>

    <img :src="img_url">

</template>

在script中設定變數

<script>

    //方法1.直接將圖片引入為模組

    require img_url from "../assets/test.png"

    //方法2.將img_url放在資料裡

    data(){

        return {

            img_url:require("../assets/test.png")

        }

    }

    //方法3.在生命週期函式中設定

    data(){

        return {

            img_url:""

        }

    }

    created(){

        this.img_url= require("@/"+urlTemp)

    }

</script>