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. BugPhobia开发篇章:Scurm Meeting-更新至0x03

    0x01 :目录与摘要 If you weeped for the missing sunset, you would miss all the shining stars 索引 提纲 整理与更新记录 ...

  2. Scrum Meeting 10.24

    成员 已完成任务 下一阶段任务 用时 徐越 阅读后端代码,了解服务器的概念,以及服务器和终端间的通信机制 学习服务器配置 4h 赵庶宏 阅读后端代码,了解服务器的概念,以及服务器和终端间的通信机制 阅 ...

  3. 学习pl/sql之一

    --使用pl/sql语句打印一个hello world begin   dbms_output.put_line('hello,world'); end;      但是在sqlplus里面就不一样了 ...

  4. 灵悟礼品网上专卖店Sprint计划

    一.现状 小组成员初步了解了所做项目的大致内容,需要时间一步一步分析和规划. 二.部分需求索引卡 第一个阶段没有具体功能的实现,只是先把所要做的项目思路理清,并把相应的数据库建立好. 三.任务认领 产 ...

  5. 20181126-java-面试知识-收集

    链接:最近面试java后端开发的感受:如果就以平时项目经验来面试,通过估计很难——再论面试前的准备 两本书的链接:Java Web轻量级开发面试教程和Java核心技术及面试指南.

  6. node websocket学习研究

    websocket作为不同于http的数据传输方式,是开发一些实时系统的不二选择. 最近在研究开发websocket方面的小程序.小程序客户端直接对websocket做了封装.自己只要写后端就可以了. ...

  7. python 菜鸟入门

    python 菜鸟博客: http://www.cnblogs.com/wupeiqi/articles/5433893.html http://www.cnblogs.com/linhaifeng/ ...

  8. 解决win10激活错误代码0xc004c003

    打开命令窗口(管理员). win10电脑图解-2 输入slmgr.vbs /upk,回车 激活错误电脑图解-3 输入:slmgr /ipk W269N-WFGWX-YVC9B-4J6C9-T83GX, ...

  9. Construct BST from given preorder traversal

    Given preorder traversal of a binary search tree, construct the BST. For example, if the given trave ...

  10. 隐藏基于Dialog的MFC的主窗体

    最近需要做一个主窗体常态隐藏的程序,类似360卫士那样,只有托盘图标常显示.本以为隐藏主窗体很简单,但遇到了意想不到的情况. 无效的做法 最初的想法是设置主对话框资源的 Visiable 属性为 fa ...