Vue2 模板template的四种写法总结


Posted in Javascript onFebruary 23, 2018

如下所示:

<div id="app"> 
 <h1>我是直接写在构造器里的模板1</h1> 
</div> 
 
<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:'#demo3' 
 
  //第4种模板 写在<script type="x-template">标签里 
  template:'#demo4' 
 }) 
</script>

推荐第4种。

以上这篇Vue2 模板template的四种写法总结就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
禁止刷新,回退的JS
Nov 25 Javascript
javascript静态的url如何传递
May 03 Javascript
jquery插件制作 手风琴Panel效果实现
Aug 17 Javascript
js 连接数据库如何操作数据库中的数据
Nov 23 Javascript
HTML Color Picker(js拾色器效果)
Aug 27 Javascript
JavaScript中this的使用详解
Nov 08 Javascript
网页广告中JS代码的信息监听示例
Apr 02 Javascript
实现checkbox全选、反选、取消JavaScript小脚本异常
Apr 10 Javascript
Bootstrap框架安装使用详解
Jan 21 Javascript
在JS循环中使用async/await的方法
Oct 12 Javascript
如何在JavaScript中优雅的提取循环内数据详解
Mar 04 Javascript
vue cli安装使用less的教程详解
Jul 12 Javascript
Vue 创建组件的两种方法小结(必看)
Feb 23 #Javascript
Vue-cli Eslint在vscode里代码自动格式化的方法
Feb 23 #Javascript
ES6下子组件调用父组件的方法(推荐)
Feb 23 #Javascript
angular动态表单制作
Feb 23 #Javascript
angularjs中$http异步上传Excel文件方法
Feb 23 #Javascript
浅谈vuejs实现数据驱动视图原理
Feb 23 #Javascript
Vue父组件调用子组件事件方法
Feb 23 #Javascript
You might like
PHP中在数据库中保存Checkbox数据(2)
2006/10/09 PHP
如何用php生成扭曲及旋转的验证码图片
2013/06/07 PHP
PHP如何防止XSS攻击与XSS攻击原理的讲解
2019/03/22 PHP
JavaScript弹簧振子超简洁版 完全符合能量守恒,胡克定理
2009/10/25 Javascript
JQUERY操作JSON实例代码
2010/02/09 Javascript
JS和Jquery获取和修改label的值的示例代码
2014/01/15 Javascript
JQuery以JSON方式提交数据到服务端示例代码
2014/05/05 Javascript
JavaScript中的Promise使用详解
2015/06/24 Javascript
jQuery中$(function() {});问题详解
2015/08/10 Javascript
使用nodejs下载风景壁纸
2017/02/05 NodeJs
vue2.0实战之使用vue-cli搭建项目(2)
2017/03/27 Javascript
完美解决UI-Grid表格元素中多个空格显示为一个空格的问题
2017/04/25 Javascript
JS中的三个循环小结
2017/06/20 Javascript
vue音乐播放器插件vue-aplayer的配置及其使用实例详解
2017/07/10 Javascript
jQuery实现动态添加节点与遍历节点功能示例
2017/11/09 jQuery
React 使用recharts实现散点地图的示例代码
2018/12/07 Javascript
基于vue写一个全局Message组件的实现
2019/08/15 Javascript
ES6 class类链式继承,实例化及react super(props)原理详解
2020/02/15 Javascript
Element Dialog对话框的使用示例
2020/07/26 Javascript
Python学习笔记(二)基础语法
2014/06/06 Python
Django代码性能优化与Pycharm Profile使用详解
2018/08/26 Python
Python列表常见操作详解(获取,增加,删除,修改,排序等)
2019/02/18 Python
python中的数据结构比较
2019/05/13 Python
tensorflow使用指定gpu的方法
2020/02/04 Python
HTML5验证以及日期显示的实现详解
2013/07/05 HTML / CSS
德国大型和小型家用电器网上商店:Energeto
2019/05/15 全球购物
中专药剂专业应届毕的自我评价
2013/12/27 职场文书
高中军训广播稿
2014/01/14 职场文书
校园文化建设方案
2014/02/03 职场文书
会计专业求职信范文
2014/03/16 职场文书
幼儿园大班区域活动总结
2014/07/09 职场文书
产品陈列协议书(标准版)
2014/09/17 职场文书
大学毕业生个人总结
2015/02/28 职场文书
关于艺术节的开幕致辞
2016/03/04 职场文书
Nginx反向代理配置的全过程记录
2021/06/22 Servers
Golang的继承模拟实例
2021/06/30 Golang