1. 程式人生 > >如何輸出基本的HTML,v-html指令

如何輸出基本的HTML,v-html指令

vue預設會轉義html程式碼,即變數中儲存的html程式碼,預設vue不會將其渲染成html元素,而是輸出為純文字。
看程式碼:
如何輸出基本的HTML,v-html指令
我們想要在1處輸出“新浪”的連結,點選“新浪”就能夠跳轉到新浪網站,但是實際輸出的結果是:如何輸出基本的HTML,v-html指令
輸出的是html程式碼,而不是解析後的結果。原因在於{{變數a}},vue只是去將變數a在vue的data中儲存的資料拿過來填上而已,沒有去做解析這一步的操作。想要vue去解析變數a中的html程式碼,需要這麼寫:
如何輸出基本的HTML,v-html指令
利用v-html指令完成解析html字串的操作。結果為:
如何輸出基本的HTML,v-html指令

v-html:告訴vue去渲染html程式碼,而不是去轉義它。