<!DOCTYPE html>

 <html>

     <head>

         <meta charset="UTF-8">

         <title>Vue</title>

         <style>

         </style>

     </head>

     <body>

         <div id="app">

             <my-component></my-component>

             <script type="text/x-template" id="my-component">

                 <div>这是组件的内容</div>

             </script>

         </div>

         <!-- 开发环境版本，包含了用帮助的命令行警告 -->

         <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

         <script type="text/javascript">

             //vue提供里另一种定义模板的方式

             //在<script>标签里面使用text/x-template类型，并且指定一个id,将这个id赋给template

             Vue.component('my-component', {

                 template: '#my-component'

             })

             var app = new Vue({

                 el:'#app'

             });    

         </script>

     </body>

 </html>

vue X-Template的更多相关文章

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

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

  2. vue 模板template

    入门 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8& ...

  3. vue写template的4种形式

    1.template标签(非单文件组件) <template id="t1"> <h2>66666666</h2> </template& ...

  4. [Vue-rx] Stream an API using RxJS into a Vue.js Template

    You can map remote data directly into your Vue.js templates using RxJS. This lesson uses axios (and ...

  5. vue中template的作用及使用

     先来看一个需求:下图div用v-for做了列表循环,现在想要span也一起循环,应该怎么做? 有3种方法可以实现 ①:直接用v-for对span也循环一次(该方法虽然可以使用,但不要用这种方式,因为 ...

  6. vue中Template 制作模版

    一.直接写在选项里的模板 直接在构造器里的template选项后边编写.这种写法比较直观,但是如果模板html代码太多,不建议这么写. javascript代码: var app=new Vue({ ...

  7. Vue组件template模板字符串几种写法

    在定义Vue组件时,组件的模板template选项需要的是一个字符串,当其内容较复杂需要换行时,需要简单处理一下,具体有五种方式: 方式一:使用 \ 转义换行符 <!DOCTYPE html&g ...

  8. vue用template还是JSX？

    各自特点 template 模板语法(HTML的扩展) 数据绑定使用Mustache语法(双大括号) <span>{{title}}<span> JSX JavaScript的 ...

  9. vue中template的三种写法

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

  10. VScode 中 vue文件template中不能使用tab补齐标签

    选择 文件-->首选项-->设置-->搜索  emmet,选择 编辑 setting.json, 添加下列代码: "emmet.includeLanguages" ...

随机推荐

  1. python 发送json数据操作实例分析 - python

    文章来源:嗨学网 敏而好学论坛www.piaodoo.com 欢迎大家相互学习 本文实例讲述了python 发送json数据操作.分享给大家供大家参考,具体如下: # !/usr/bin/env py ...

  2. Tomcat 配置错误界面

    Tomcat发生错误时跳转到错误页面 注意 :5.0下操作需要删除掉注释语句,不然报错,原因未知 一.修改 tomcat 的配置文件 修改 tomcat 的配置文件,当页面发生错误时跳转到指定的页面, ...

  3. 带你逐行阅读redux源码

    带你逐行阅读redux源码 redux版本:2019-7-17最新版:v4.0.4 git 地址:https://github.com/reduxjs/redux/tree/v4.0.4 redux目 ...

  4. mysql查询表的创建时间

    mysql查询表的创建时间 查询语句: SELECT table_name,create_time FROM information_schema.TABLES;

  5. 在Anaconda环境下使用Jupyter Notebook

    !!!Anaconda 和 Jupyter Notebook 在 zsh 环境下不能正常使用! 启动建立的 Anaconda 环境 安装 nb_conda:conda install nb_conda ...

  6. Elasticsearch：使用function_score及soft_score定制搜索结果的分数

    我们将介绍使用function_score的基础知识,并介绍一些function core技术非常有用和有效的用例. 介绍 评分的概念是任何搜索引擎(包括Elasticsearch)的核心.评分可以粗 ...

  7. setTimeout（）和setInterval（）的用法及区别

    setInterval 方法表示每间隔一段时间执行一次函数,会一直执行下去,除非手动 clearInterval 来停止. var i = 10; var timer = setInterval(() ...

  8. Mybatis基于XML配置SQL映射器(二)

    Mybatis之XML注解 之前已经讲到通过 mybatis-generator 生成mapper映射接口和相关的映射配置文件: 下面我们将详细的讲解具体内容 首先我们新建映射接口文档  sysUse ...

  9. 微服务架构 技能图谱skill-map

    # 微服务架构 技能图谱 ## 理论基础### 概念#### 多微合适 - 非代码函数 - 非重写时间 - 适合团队最重要 - 独立业务属性 - 全功能团队 #### 进程隔离 - 服务运行在独立的进 ...

  10. embed元素 autostart false 失效时的解决方法

    embed元素 autostart false 失效时的解决方法 最近在工作中碰到了在网页中嵌入播放器播放声音文件的需求,最后使用了embed元素 代码如下: <embed src='1093. ...