vue指令v-html和v-text

更新時(shí)間：2021年11月22日 10:13:58 作者：huxiaoxiao

這篇文章主要介紹了 vue指令v-html和v-text，文章圍繞vue指令v-html和v-text的相關(guān)資料展開詳細(xì)內(nèi)容，需要的小伙伴可以參考一下，希望對(duì)大家有所幫助

1、v-text 文本渲染指令

（只能渲染文本不能渲染標(biāo)簽）

<div id="test">

        <p v-text="message"></p>

 </div>

 <script src="./js/vue.js"></script>

 <script>
    const vm = new Vue({

            el:"#test",

            data:{

                message:"<h2>hello vue</h2>"

            }

        })

 </script>

輸出結(jié)果為：

2、 v-html

(可以渲染指令，可以渲染標(biāo)簽)

<div id="test">

        <p v-html="message"></p>

 </div>

 <script src="./js/vue.js"></script>

 <script>

    const vm = new Vue({

            el:"#test",

            data:{

                message:"<h2>hello vue</h2>"

            }

        }) 

 </script>

輸出結(jié)果為：

到此這篇關(guān)于 vue指令v-html和v-text的文章就介紹到這了,更多相關(guān)v-html和v-text內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

相關(guān)文章

Vue事件總線的使用問題及解讀
這篇文章主要介紹了Vue事件總線的使用問題及解讀,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
2025-03-03
vue項(xiàng)目打包后proxyTable代理失效問題及解決
這篇文章主要介紹了vue項(xiàng)目打包后proxyTable代理失效問題及解決方案，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。
2023-05-05
vue實(shí)現(xiàn)行列轉(zhuǎn)換的一種方法
這篇文章主要介紹了vue實(shí)現(xiàn)行列轉(zhuǎn)換的一種方法，本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
2019-08-08
Vue3.0數(shù)據(jù)響應(yīng)式原理詳解
這篇文章主要介紹了Vue3.0數(shù)據(jù)響應(yīng)式原理詳解，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-10-10
關(guān)于在Vue中import和require的用法分析
在Vue項(xiàng)目中，我們經(jīng)常需要引入外部的模塊或文件，這時(shí)候就會(huì)用到import和require這兩個(gè)關(guān)鍵字，本文將詳細(xì)分析它們的用法，并提供具體的代碼實(shí)例和解釋,需要的朋友可以參考下
2023-06-06
基于Vue.js的表格分頁組件
這篇文章主要為大家詳細(xì)介紹了基于Vue.js的表格分頁組件使用方法，了解了Vue.js的特點(diǎn)，感興趣的朋友可以參考一下
2016-05-05
vue2筆記 — vue-router路由懶加載的實(shí)現(xiàn)
本篇文章主要介紹了vue2筆記 — vue-router路由懶加載示例，實(shí)例分析了vue-router路由懶加載的實(shí)現(xiàn),具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2017-03-03
Vue2.0表單校驗(yàn)組件vee-validate的使用詳解
本篇文章主要介紹了Vue2.0表單校驗(yàn)組件vee-validate的使用詳解，詳細(xì)的介紹了vee-validate使用教程。具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-05-05
Vue綁定class和綁定內(nèi)聯(lián)樣式的實(shí)現(xiàn)方法
本文主要介紹了Vue綁定class和綁定內(nèi)聯(lián)樣式的實(shí)現(xiàn)方法，文中通過示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-11-11
vue2.x引入threejs的實(shí)例代碼
這篇文章主要介紹了vue2.x引入threejs,如果在開發(fā)過程中出現(xiàn)threejs生成的canvas出現(xiàn)外邊框,只需要用css樣式修改，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，需要的朋友可以參考下
2022-09-09