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 相关文章推荐
ExtJS 2.0实用简明教程 之ExtJS版的Hello
Apr 29 Javascript
node.js中的fs.readSync方法使用说明
Dec 17 Javascript
jQuery实现的数值范围range2dslider选取插件特效多款代码分享
Aug 27 Javascript
ionic在开发ios系统微信时键盘挡住输入框的解决方法(键盘弹出问题)
Sep 06 Javascript
jquery实现input框获取焦点的方法
Feb 06 Javascript
JS库之wow.js使用方法
Sep 14 Javascript
vue使用中的内存泄漏【推荐】
Jul 10 Javascript
微信小程序中使用wxss加载图片并实现动画效果
Aug 13 Javascript
element UI upload组件上传附件格式限制方法
Sep 04 Javascript
微信小程序时间标签和时间范围的联动效果
Feb 15 Javascript
基于Express框架使用POST传递Form数据
Aug 10 Javascript
vue-froala-wysiwyg 富文本编辑器功能
Sep 19 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
Access数据库导入Mysql的方法之一
2006/10/09 PHP
PHP程序员常见的40个陋习,你中了几个?
2014/11/20 PHP
php实现根据IP地址获取其所在省市的方法
2015/04/30 PHP
基于PHP实现假装商品限时抢购繁忙的效果
2015/10/16 PHP
php命令行(cli)模式下报require 加载路径错误的解决方法
2015/11/23 PHP
php检查函数必传参数是否存在的实例详解
2017/08/28 PHP
编写自己的jQuery插件简单实现代码
2011/04/19 Javascript
JS Map 和 List 的简单实现代码
2013/07/08 Javascript
JavaScript实现复制功能各浏览器支持情况实测
2013/07/18 Javascript
node.js中的fs.appendFile方法使用说明
2014/12/17 Javascript
json对象转为字符串,当做参数传递时加密解密的实现方法
2016/06/29 Javascript
JavaScript中数组的22种方法必学(推荐)
2016/07/20 Javascript
Bootstrap3 多选和单选框(checkbox)
2016/12/29 Javascript
Bootstrap3下拉菜单的实现
2017/02/22 Javascript
详解Node.js利用node-git-server快速搭建git服务器
2017/09/27 Javascript
vue+webpack实现异步加载三种用法示例详解
2018/04/24 Javascript
JS判断用户用的哪个浏览器实例详解
2018/10/09 Javascript
VueJS 组件参数名命名与组件属性转化问题
2018/12/03 Javascript
layui弹出框Tab选项卡的示例代码
2019/09/04 Javascript
vue 移动端记录页面浏览位置的方法
2020/03/11 Javascript
微信小程序实现列表左右滑动
2020/11/19 Javascript
[01:03:36]Ti4 循环赛第三日DK vs Titan
2014/07/12 DOTA
[00:35]可解锁地面特效
2018/12/20 DOTA
Python Trie树实现字典排序
2014/03/28 Python
从零学Python之入门(二)基本数据类型
2014/05/25 Python
Python和perl实现批量对目录下电子书文件重命名的代码分享
2014/11/21 Python
利用Python自动监控网站并发送邮件告警的方法
2016/08/24 Python
Python自定义函数实现求两个数最大公约数、最小公倍数示例
2018/05/21 Python
详解Pytorch 使用Pytorch拟合多项式(多项式回归)
2018/05/24 Python
python实现字符串完美拆分split()的方法
2019/07/16 Python
python中@property和property函数常见使用方法示例
2019/10/21 Python
python开发实例之python使用Websocket库开发简单聊天工具实例详解(python+Websocket+JS)
2020/03/18 Python
Jupyter Notebook的连接密码 token查询方式
2020/04/21 Python
2014年信访工作总结
2014/11/17 职场文书
2015年消防工作总结
2015/04/24 职场文书
2019年描写人生经典诗句大全
2019/07/08 职场文书