<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8"/>

        <script src="vue.js"></script>

    </head>

    <body>

        <div>

        <h1>--内联模板--</h1>

        <div id="example1">

            <my-component inline-template>

              <div>

                <p>These are compiled as the component's own template.</p>

                <p>Not parent's transclusion content.</p>

              </div>

            </my-component>

        </div>

        <script>

        Vue.component('my-component', {})

        // Vue 根实例

        var example1 = new Vue({

            el: '#example1'

        })

        </script>

        </div>

        <div>

        <h1>--X-Template--</h1>

        <div id="example2">

            <hello-world></hello-world>

        </div>

        <script type="text/x-template" id="hello-world-template">

          <p>Hello hello hello</p>

        </script>

        <script>

        Vue.component('hello-world', {template: '#hello-world-template'})

        // Vue 根实例

        var example2 = new Vue({

            el: '#example2'

        })

        </script>

        </div>

    </body>

</html>

运行效果图：

内联模板、X-Template的更多相关文章

  1. Vue 内联模板(inline-template)

    内联模板不会把子组件的内容分发渲染到父组件中 而是需要在父组件中实现其内容的渲染 父组件 <template> <div> <template-inline inline ...

  2. Vue 组件6内联模板

    如果子组件有inline-template特性,组件将把它的内容当做模板,而不是把它当做分发内容,这样模板更灵活. <my-component inline-template> <d ...

  3. vue 组件高级用法（递归组件，内联模板，动态组件，异步组件）

  4. 不可或缺 Windows Native (16) - C++: 函数重载, 缺省参数, 内联函数, 函数模板

    [源码下载] 不可或缺 Windows Native (16) - C++: 函数重载, 缺省参数, 内联函数, 函数模板 作者:webabcd 介绍不可或缺 Windows Native 之 C++ ...

  5. C++ primer（八）--内联函数 引用变量 引用传递函数参数 函数重载/模板/模板具体化

    一.内联函数     常规函数和内联函数的区别在于C++编译器如何将他们组合到程序中.编译过程的最终产品是可执行程序--由一组机器语言指令组成.运行程序时,操作系统将这些指令载入到计算机内存中,因此每 ...

  6. C++内联函数、函数模板之于头文件

    一.基本说明 C++标准中提到,一个编译单元是指一个.cpp文件以及它所include的所有.h文件,.h文件里的代码将会被扩展到包含它的.cpp文件里,然后编译器编译该.cpp文件为一个.obj文件 ...

  7. [C++ Primer Plus] 第8章、函数探幽（一）程序清单——内联、引用、格式化输入输出、模板、decltype

    程序清单8.1(inline内联函数) #include<iostream> using namespace std; inline double square(double x) {// ...

  8. 堆（stack） 之 c 和 c++模板实现（空类默认成员函数 初谈引用 内联函数）

    //stack 的基本操作 #include <iostream> using namespace std; const int maxn = 3; typedef struct Stac ...

  9. c++hook内联汇编模板

    1 #include "Windows.h" 2 #include "tlhelp32.h" 3 #include "String.h" 4 ...

随机推荐

  1. 超过三张表禁止join

    一. 问题提出 <阿里巴巴JAVA开发手册>里面写超过三张表禁止join,这是为什么? 二.问题分析 对这个结论,你是否有怀疑呢?也不知道是哪位先哲说的不要人云亦云,今天我设计sql,来验 ...

  2. 使用Spring Data ElasticSearch框架来处理索引

    /**步骤:创建工程,导入相应的包--->配置文件---->创建实体类对象------>创建接口---->测试增删改查的方法 **/ //步骤:创建工程,导入相应的包 < ...

  3. Mybatis读取数据实战

    1.Mybatis基础配置 <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE configu ...

  4. Unity——WegGL打包问题

    Rendering设置 Gamma和Linear颜色空间,两者有色差,Gamma有个2.25左右的修正值: WebGL2.0可用的情况,只支持Deferred Render延迟渲染,且只支持Linea ...

  5. Redis集群断电恢复

    再集群整体断点或关闭后,默认启动集群后,会成为孤立的单点,需要删除每个节点的pid文件,node.conf.并将RDB和AOF文件移动出来,再挨个启动每个节点,并用create创建集群脚本,重新创建集 ...

  6. Samba 源码解析之内存管理

    由于工作需要想研究下Samba的源码,下载后发现目录结构还是很清晰的.一般大家可能会对source3和source4文件夹比较疑惑.这两个文件夹针对的是Samba主版本号,所以你可以暂时先看一个.这里 ...

  7. msfvenom生成payload命令

    msfvenom生成payload命令 windows: msfvenom -a x86 --platform Windows -p windows/meterpreter/reverse_tcp L ...

  8. CF1547B Alphabetical Strings 题解

    Content 我们有一个空的字符串,第 \(i\) 次操作我们可以将字母表中第 \(i\) 个字母加入字符串的最前面或最后面.我们称一个长度为 \(n\) 的字符串是合法的,当且仅当这个字符串可以通 ...

  9. winpcap 静默安装

    前几天做一个小工具用到winpcap,由于有些用户系统未必安装过这个而领导要求尽量减少用户点击,于是只好想办法静默安装了,csdn搜了,貌似没有好用的,求助stackoverflow,还好,在某篇解答 ...

  10. Qt5设置lineEdit正则表达式

    说明 本文演示Qt 版本: qt5.14 一个例子 下面的代码中演示 输入框只能输入 冒号.A-F.a-f,数字0~9,最长输入64个字符 /// 设置验证 auto le_set_check = [ ...