做聊天表情时，表情图片放在assets目录中，读取数组动态显示图片时发现图片显示不出来

问题描述：做聊天表情时，表情图片放在assets目录中，读取数组动态显示图片时发现图片显示不出来，但是如果是在src=""这里是写死的字符串是能显示的

如下图：第一个img可以显示，第二个不行（变量的路径是没错的，一样的路径）

<div class="face-item" v-for="(item,index) in emotionList" @click="clickEmoticon(item.src, item.sign)" :key="index" :title="item.desc">
	<img src="../assets/images/logo.png">
	<img :src="item.src">
</div>

问题：发现是assets目录下的图片，需要使用require()进行包裹的处理的，于是如下：

<img :name="item.desc" :src="require('../assets/images/logo.png')">

发现还是不行，这里没想明白，后来百度发现说require中不能用变量，只能是字符串。。。，很难受。

这里尝试了2种办法可以：

法一：在定义数组变量这里就用require包裹（require(xx)返回的值是一个base64的数值），然后页面显示直接不变，用:src="item.src"

let EMOTION_LIST = [
  {
    "src": require("../assets/images/emoji/0000.gif"),
    "sign": "[emoji_0000.gif]"
  },
  {
    "src": require("../assets/images/emoji/0001.gif"),
    "sign": "[emoji_0001.gif]"
  }
]

法二：数组对象中只留了文件名，把前面的路径和后缀都剪掉了，然后在拼接起来，不知道这样为什么就可以，反正是能正常显示的

<img :src="getSrc(item.src)">
......
methods: {
    getSrc(src){
        return "../assets/images/emoji/" + src + ".gif"
    }
}

let EMOTION_LIST = [
  {
    "src": "0000",
    "sign": "[emoji_0000.gif]"
  },
  {
    "src": "0001",
    "sign": "[emoji_0001.gif]"
  }
]

记录一下~