Heim >Web-Frontend >js-Tutorial >So verwenden Sie eine Vorlage in der Vue2-Vorlage

So verwenden Sie eine Vorlage in der Vue2-Vorlage

亚连
亚连Original
2018-06-05 09:42:353139Durchsuche

Jetzt werde ich Ihnen eine Zusammenfassung der vier Schreibmethoden der Vue2-Vorlage geben. Sie hat einen guten Referenzwert und ich hoffe, dass sie für alle hilfreich sein wird.

Wie unten gezeigt:

<p id="app"> 
 <h1>我是直接写在构造器里的模板1</h1> 
</p> 
 
<template id="demo3"> 
 <h1 style="color:red">我是选项模板3</h1> 
</template> 
 
<script type="x-template" id="demo4"> 
 <h1 style="color:red">我是script标签模板4</h1> 
</script> 
 
<script> 
 var vm=new Vue({ 
  el:"#app", 
  data:{ 
   message:1 
  }, 
 
  //第2种模板 写在构造器里 
  //template:`<h1 style="color:red">我是选项模板2</h1>` 
 
  //第3种模板 写在<template>标签里 
  //template:&#39;#demo3&#39; 
 
  //第4种模板 写在<script type="x-template">标签里 
  template:&#39;#demo4&#39; 
 }) 
</script>

Das Obige habe ich für alle zusammengestellt. Ich hoffe, dass es in Zukunft für alle hilfreich sein wird.

Verwandte Artikel:

So erstellen Sie element-ui (ausführliche Anleitung)

So ändern Sie den Standardstil in elementui

Verwenden Sie elementUI, um benutzerdefinierte Designmethoden in Vue zu implementieren

Das obige ist der detaillierte Inhalt vonSo verwenden Sie eine Vorlage in der Vue2-Vorlage. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn