<!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. 新建maven项目index.jsp文件报错处理

    最近用eclipse新建了一个maven项目,结果刚新建完成index.jsp页面就报错了,先把错误信息贴出来看看 后来就找资料,结果发现两种解决办法,希望可以帮助用得上的人! 第一种:直接在pom. ...

  2. Java中Calendar类的常用方法（对时间进行计算的类）

    例子: /**** * 传入具体日期 ,返回具体日期增加一个月. * @param date 日期(2017-04-13) * @return 2017-05-13 * @throws ParseEx ...

  3. leetcode-第14周双周赛-1273-删除树节点

    题目描述: 自己的提交:动态规划 class Solution: def deleteTreeNodes(self, nodes: int, parent: List[int], value: Lis ...

  4. String path = request.getContextPath();报错

    String path = request.getContextPath();报错 1. 右击该项目 - Build Path - Configure Build Path , 在 Libraries ...

  5. Steup Factory 操作注册表

    //判断注册表是否存在,不存在就创建 result = Registry.DoesKeyExist(HKEY_CURRENT_USER, "SOFTWARE\\MyTestApp" ...

  6. 【LeetCode 31】下一个排列

    题目链接 [题解] 从右往左找第一个下降的位置i(即满足nums[i]<nums[i+1]); 然后在[i+1..len-1]这个区间里面找到一个最大的下标k,使得nums[k]>nums ...

  7. Java的传值调用

    (本文非引战或diss,只是说出自己的理解,欢迎摆正心态观看或探讨) 引子 之所以写这篇文章是因为前些天写了一篇<Java中真的只有值传递么?>探讨了网上关于Java只有值传递的说法,当时 ...

  8. 修改Tomcat的server.xml之后，tomcat 部署项目报错：Removing obsolete files from server... Could not clean server of obsolete files: null java.lang.NullPointerException

    介个是你在clean tomcat的时候 文件没有clean清.(临时崩溃 系统宕机或其他原因)导致自己eclipse里的service.xml 在clean时没有copy一致. 解决方案: 1找到你 ...

  9. dos添加文件夹属性！

    attrib 显示所有文件的属性:参数:+r或-r [文件名] 设置文件属性是否为只读 +h或-h [文件名] 设置文件属性是否隐含 +s或-s [文件名] 设置文件属性是否为系统文件 +a或-a [ ...

  10. Openstack组件部署 — keystone(domain, projects, users, and roles)

    目录 目录 前文列表 Create a domain projects users and roles domain projects users and roles的意义和作用 Create the ...