Vue2 模板template的四種寫法總結(jié)

更新時(shí)間：2018年02月23日 14:44:24 作者：xuanwuziyou

下面小編就為大家分享一篇Vue2 模板template的四種寫法總結(jié)，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧

如下所示：

<div id="app"> 
 <h1>我是直接寫在構(gòu)造器里的模板1</h1> 
</div> 
 
<template id="demo3"> 
 <h1 style="color:red">我是選項(xiàng)模板3</h1> 
</template> 
 
<script type="x-template" id="demo4"> 
 <h1 style="color:red">我是script標(biāo)簽?zāi)０?</h1> 
</script> 
 
<script> 
 var vm=new Vue({ 
  el:"#app", 
  data:{ 
   message:1 
  }, 
 
  //第2種模板 寫在構(gòu)造器里 
  //template:`<h1 style="color:red">我是選項(xiàng)模板2</h1>` 
 
  //第3種模板 寫在<template>標(biāo)簽里 
  //template:'#demo3' 
 
  //第4種模板 寫在<script type="x-template">標(biāo)簽里 
  template:'#demo4' 
 }) 
</script>

推薦第4種。

以上這篇Vue2 模板template的四種寫法總結(jié)就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

vue
template

相關(guān)文章

vue-cli 構(gòu)建骨架屏的方法示例
這篇文章主要介紹了vue-cli 構(gòu)建骨架屏的方法示例,小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2018-11-11
vue-cli如何修改打包項(xiàng)目結(jié)構(gòu)及前綴
這篇文章主要介紹了vue-cli如何修改打包項(xiàng)目結(jié)構(gòu)及前綴問題，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2023-07-07
如何用 Deepseek 寫的uniapp血型遺傳查詢工具
在現(xiàn)代社會中,了解血型遺傳規(guī)律對于優(yōu)生優(yōu)育、醫(yī)療健康等方面都有重要意義,本文將介紹如何使用Uniapp開發(fā)一個(gè)跨平臺的血型遺傳查詢工具,幫助用戶預(yù)測孩子可能的血型,感興趣的朋友一起看看吧
2025-04-04
vue時(shí)間線組件的使用方法
這篇文章主要為大家詳細(xì)介紹了vue時(shí)間線組件的使用方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-08-08
Vue項(xiàng)目新一代狀態(tài)管理工具Pinia的使用教程
pinia是一個(gè)輕量級的狀態(tài)管理庫,屬于 vue3 生態(tài)圈新的成員之一,下面這篇文章主要給大家介紹了關(guān)于Vue項(xiàng)目新一代狀態(tài)管理工具Pinia的使用教程,需要的朋友可以參考下
2022-11-11
element-ui中el-table不顯示數(shù)據(jù)的問題解決
這篇文章主要介紹了element-ui中el-table不顯示數(shù)據(jù)的問題解決,這是最近在做列表首頁時(shí)遇到的一個(gè)問題,文中通過圖文介紹的非常詳細(xì),需要的朋友可以參考下
2023-07-07
詳解vue-cli項(xiàng)目中怎么使用mock數(shù)據(jù)
這篇文章主要介紹了vue-cli項(xiàng)目中怎么使用mock數(shù)據(jù)，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2018-05-05
vue3系統(tǒng)進(jìn)入頁面前的權(quán)限判斷和重定向方式
這篇文章主要介紹了vue3系統(tǒng)進(jìn)入頁面前的權(quán)限判斷和重定向方式,具有很好的參考價(jià)值,希望對大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
2024-03-03
vue-cli 環(huán)境變量 process.env的使用及說明
這篇文章主要介紹了vue-cli 環(huán)境變量 process.env的使用及說明，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-12-12
Vue 表單控件綁定的實(shí)現(xiàn)示例
本篇文章主要介紹了Vue 表單控件綁定的實(shí)現(xiàn)示例，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-08-08