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判断浏览器类型为ie6时不执行
Jun 15 Javascript
JS控制表格实现一条光线流动分割行的方法
Mar 09 Javascript
基于Jquery实现焦点图淡出淡入效果
Nov 30 Javascript
JavaScript中定义类的方式详解
Jan 07 Javascript
深入理解JS正则表达式---分组
Jul 18 Javascript
用js读写cookie的简单方法(推荐)
Aug 08 Javascript
js实现颜色阶梯渐变效果(Gradient算法)
Mar 21 Javascript
Vue实现一个返回顶部backToTop组件
Jul 25 Javascript
vue.js组件vue-waterfall-easy实现瀑布流效果
Aug 22 Javascript
angular 数据绑定之[]和{{}}的区别
Sep 25 Javascript
jquery实现手风琴案例
May 04 jQuery
vuecli3.x中轻松4步带你使用tinymce的步骤
Jun 25 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
mysq GBKl乱码
2006/11/28 PHP
php下mysql数据库操作类(改自discuz)
2010/07/03 PHP
PHP+Mysql+jQuery实现动态展示信息
2011/10/08 PHP
PHP检查网站是否宕机的方法示例
2017/07/24 PHP
php对微信支付回调处理的方法
2018/08/23 PHP
laravel model模型定义实现开启自动管理时间created_at,updated_at
2019/10/17 PHP
nodejs 后缀名判断限制代码
2011/03/31 NodeJs
Json和Jsonp理论实例代码详解
2013/11/15 Javascript
JS实现随机乱撞彩色圆球特效的方法
2015/05/05 Javascript
jquery.cookie实现的客户端购物车操作实例
2015/12/24 Javascript
JavaScript程序中实现继承特性的方式总结
2016/06/24 Javascript
原生JS京东轮播图代码
2017/03/22 Javascript
Javascript中类式继承和原型式继承的实现方法和区别之处
2017/04/25 Javascript
d3.js实现立体柱图的方法详解
2017/04/28 Javascript
NodeJS设计模式总结【单例模式,适配器模式,装饰模式,观察者模式】
2017/09/06 NodeJs
基于jQuery.i18n实现web前端的国际化
2018/05/04 jQuery
vue实现组件之间传值功能示例
2018/07/13 Javascript
node上的redis调用优化示例详解
2018/10/30 Javascript
Vue 子组件与数据传递问题及注意事项
2019/07/11 Javascript
vue+element tabs选项卡分页效果
2020/06/29 Javascript
js实现QQ邮箱邮件拖拽删除功能
2020/08/27 Javascript
解决vue elementUI 使用el-select 时 change事件的触发问题
2020/11/17 Vue.js
python登录QQ邮箱发信的实现代码
2013/02/10 Python
Python脚本实现虾米网签到功能
2016/04/12 Python
ubuntu中配置pyqt4环境教程
2017/12/27 Python
Python实现基于PIL和tesseract的验证码识别功能示例
2018/07/11 Python
Python使用sqlalchemy模块连接数据库操作示例
2019/03/13 Python
css3实现背景动态渐变效果
2019/12/10 HTML / CSS
Foot Locker英国官网:美国知名运动产品零售商
2019/02/21 全球购物
香港士多网上超级市场:Ztore
2021/01/09 全球购物
贸易经济专业自荐书
2014/06/29 职场文书
高校教师个人工作总结2014
2014/12/17 职场文书
神龙架导游词
2015/02/11 职场文书
李白故里导游词
2015/02/12 职场文书
南极大冒险观后感
2015/06/05 职场文书
教师师德承诺书2016
2016/03/25 职场文书