問題描述：

使用 Vue 渲染資料時，遇到了如下神奇一幕，bug 原因非常簡單，但結果卻讓人摸不著頭腦，特此記錄，以備日後檢視！

如上圖，重新整理頁面時，內容一閃而過，隨後一直白屏，無任何內容顯示，特將問題程式碼精簡為以下內容

<div id="content">
    <img v-bind:src="{{img}}" alt="">
</div>
<script>
    new Vue({
        el: '#content',
        data: {
            img: 'fa7d55720d6cf.png'
        }
    })
</script>

---

解決方案：

看到程式碼，相信部分大佬已經發現錯誤原因了。是的，此處繫結圖片只需要寫變數名稱即可，無需加大括號

# 錯誤
<img v-bind:src="{{img}}" alt="">

# 正確
<img v-bind:src="img" alt="">

bug 原因非常簡單，但是解決過程可謂是一波三折，

先是以為 載入問題，各種使用 v-cloak 無果
後續以為 圖片路徑問題，各種調整 圖片路徑無效
Chrome 搜尋記錄 4, 5頁
。。。