1.template标签(非单文件组件)

<template id="t1">
<h2>66666666</h2>
</template> <script>
new Vue({
template: '#t1'
})
</script>

2.template标签单页面组件

和上面一样用<template></template>,由于有vue-loader编译不需要在手动在选项template上加‘#t1’之类的

3.反单引号

<script>
new Vue({
template: `
<div>
<h2>2333</h2>
</div>
`
})
</script>

4.script标签(type="x-template")

<script type="x-template" id="tem">
<h2>我是古天乐~<div>666</div></h2>
</script> <script>
new Vue({
template:'#tem'
})
</script>

vue写template的4种形式的更多相关文章

  1. vue中template的三种写法

    第一种(使用模板字符串)早期字符串拼接年代 <div id="app"></div> new Vue({ el: "#app", tem ...

  2. ASP.NET MVC深入浅出(被替换) 第一节: 结合EF的本地缓存属性来介绍【EF增删改操作】的几种形式 第三节: EF调用普通SQL语句的两类封装(ExecuteSqlCommand和SqlQuery ) 第四节: EF调用存储过程的通用写法和DBFirst模式子类调用的特有写法 第六节: EF高级属性(二) 之延迟加载、立即加载、显示加载(含导航属性) 第十节: EF的三种追踪

    ASP.NET MVC深入浅出(被替换)   一. 谈情怀-ASP.NET体系 从事.Net开发以来,最先接触的Web开发框架是Asp.Net WebForm,该框架高度封装,为了隐藏Http的无状态 ...

  3. vue实现复制粘贴的两种形式

    方式一: 1.安装clipboard:npm install clipboard 2.src/utils/clipboard.js import Vue from 'vue' import Clipb ...

  4. vue组件创建的三种方式

    1.使用Vue.extend创建全局的Vue组件 //1.1 使用vue.extend创建组件 var com1 = Vue.extend({ //通过template属性指定组件要展示的html结构 ...

  5. 一字一句的搞懂vue-cli之vue webpack template配置

    webpack--神一样的存在.无论写了多少次,再次相见,仍是初见.有的时候开发vue项目,对尤大的vue-cli感激涕零.但是,但是,但是...不是自己的东西,真的很不想折腾.所以,我们就得深入内部 ...

  6. vue组件通信的几种方式

    最近用vue开发项目,记录一下vue组件间通信几种方式 第一种,父子组件通信 一.父组件向子组件传值 1.创建子组件,在src/components/文件夹下新建一个Child.vue 2.Child ...

  7. Vue基础01vue的基本示例,vue的双向数据绑定,vue中常见的几种用法,vue相关常见指令

    自学vue框架,每天记录重要的知识点,与大家分享!有不足之处,希望大家指正. 本篇将讲述:vue的基本示例,vue的双向数据绑定,vue中常见的几种用法,vue相关常见指令 前期学习基础,使用vue. ...

  8. Vue创建组件的三种方式

    1.使用 Vue.extend 来创建全局的Vue组件 <div id="app"> <!-- 如果要使用组件,直接,把组件的名称,以 HTML 标签的形式,引入 ...

  9. 黑马vue---56-58、vue组件创建的三种方式

    黑马vue---56-58.vue组件创建的三种方式 一.总结 一句话总结: 不论是哪种方式创建出来的组件,组件的 template 属性指向的模板内容,必须有且只能有唯一的一个根元素 1.使用 Vu ...

随机推荐

  1. PSP Daily软件beta版本——基于spec评论

    题目要求: 每个小组评论其他小组beta发布作品的软件功能说明书. 试用(并截图)所有其他小组的beta作品,与软件功能说明书对比,评论beta作品对软件功能说明书的实现. 根据软件功能说明书,测试所 ...

  2. Daily Scrumming* 2015.10.31(Day 12)

    一.今明两天任务表 Member Today’s Task Tomorrow’s Task 江昊 学习rails的HTTP控制 继续学习rails等项目工具 杨墨犁 学习semanticUI的用法,配 ...

  3. 20135234mqy-——信息安全系统设计基础第七周学习总结

    第六章 存储器层次结构 存储器系统是一个具有不同容量,成本和访问时间的存储设备的层次结构. CPU寄存器保存着最常用的数据. 靠近CPU的小的,快速的高速缓存存储器作为一部分存储在相对较慢的主存储器( ...

  4. ejb与javabean的区别总结

    EJB的英文全称是企业级的JavaBean 两者是完全不同的 JavaBean是一个组件,而EJB就是一个组建框架 JavaBean面向的是业务逻辑和表示层的显示,通过编写一个JavaBean,可以将 ...

  5. 微信小程序公共组件的引用与控制

    思路: 1.在组件wxml文件里实现布局.数据绑定.事件绑定: 2.组件js文件里定义事件,并将文件所有内容作为一个对象export出去:3.在引用的文件引入组件(方式有两种,一个是用include引 ...

  6. PHP qq第三方登录,install时,报Not Found

    最近在学习qq的第三方登录,先在慕课网中观看了相关视频,懂了原理. 然后进行操作时,在下载好SDK后,在../install/install.html中,配置了相关的openid,oppkey,cal ...

  7. python 查看与更换工作目录

    1. 进入python控制台 2. 查看工作路径,需要导入os包: import os 3. 查看工作路径的命令: os.getcwd() 4. 修改工作路径的命令: os.chdir("d ...

  8. Java将其他数据类型转换成JSON字符串格式

    Student.java package com.demo.servlet; import java.util.List; import java.util.Map; public class Stu ...

  9. Day 4 学习笔记 各种图论

    Day 4 学习笔记 各种图论 图是什么???? 不是我上传的图床上的那些垃圾解释... 一.图: 1.定义 由顶点和边组成的集合叫做图. 2.分类: 边如果是有向边,就是有向图:否则,就是无向图. ...

  10. 013 BIO、NIO、AIO的区别

    作者:nnngu GitHub:https://github.com/nnngu 博客园:http://www.cnblogs.com/nnngu 简书:https://www.jianshu.com ...