文档章节

createElement 测试

originDu
 originDu
发布于 2017/05/03 10:35
字数 282
阅读 7
收藏 0
点赞 0
评论 0

createElement ()

  • 第一个参数标签名,
  • 第二个参数如果嵌套标签就写[],里面继续写createElement,每一个变量就是一个标签
  • 如果不嵌套,第二个参数就写{},里面可以写属性,第三个参数写标签的内容,可以是变量名
<anchored-heading :level="2">Hello world! <p>pp</p></anchored-heading>

...

    Vue.component('anchored-heading', {
        render: function (createElement) {
            //createElement 第一个参数标签名,
            // 第二个参数如果嵌套标签就写[],里面继续写createElement,每一个变量就是一个标签
            // 如果不嵌套,第二个参数就写{},里面可以写属性,第三个参数写标签的内容,可以是变量名
            return createElement('div',
                [
                    createElement('i',  // 第一个i标签
                        [
                            createElement('a', { // 内部的子元素为一个a标签
                                attrs: {
                                    name: headingId,
                                    href: '#' + headingId,
                                    class: 'class'
                                }
                            }, '这是一个a标签')   // 也可以自己写
                        ]
                    ),
                    createElement('span', // 第二个span 标签
                        [
                            createElement('a', {  // 内部的子元素为一个a标签
                                attrs: {
                                    name: headingId, // 可以使用变量名
                                    href: '#' + headingId,
                                    class: 'class'  // 定义样式名
                                }
                            }, this.$slots.default) // 内容,可以使用插槽slot
                        ]
                    )
                ]
            )
        },
        props: {
            level: {    // 获取上组件的参数,并定规则
                type: Number,
                required: true
            }
        }
    })
<script type="text/x-template" id="anchored-heading-template">
  <div>
    <h1 v-if="level === 1">
      <!--<slot name='item'>item</slot>-->
      <slot></slot>
    </h1>
    <h2 v-if="level === 2">
      <slot></slot>
    </h2>
    <h3 v-if="level === 3">
      <slot></slot>
    </h3>
    <h4 v-if="level === 4">
      <slot></slot>
    </h4>
    <h5 v-if="level === 5">
      <slot></slot>
    </h5>
    <h6 v-if="level === 6">
      <slot></slot>
    </h6>
  </div>
</script>

© 著作权归作者所有

共有 人打赏支持
originDu
粉丝 1
博文 49
码字总数 16782
作品 0
海淀
php修改删除xml内容

<?php /* $dom = new DOMDocument("1.0","utf-8"); $dom -> formatOutput = true;//格式xml输出 $con = $dom -> createElement('con'); //创建一个标签 $test = $dom -> createElement('tes......

Adam-Lee ⋅ 2011/08/15 ⋅ 0

2016-10月工作日志

2016-10-18下班后把courseList.js代码弄懂courseList.js上代码的$.ajax()参数与jquery的好像不同,还有 星号前的好像不应该用分号,应该用逗号 2016-10-19学习使用postman测试借口 2016-10-...

LM加强 ⋅ 2016/10/18 ⋅ 0

使用createElement()创建checkbox不能设置name属性

今天在使用document.createElement()动态创建复选框时,发现不能为其name赋值,以下是测试代码: Test

kjmeng ⋅ 2008/08/01 ⋅ 0

解码GWT的JS小工具--degwt

degwt是一个解码GWT(google的网页工具包)生成的javascript代码的小工具。使用方法: 1.访问任何开启GWT的站点,例如:http://www.whirled.com/ 。 2.将下边的代码粘贴到地址栏。 javascript...

匿名 ⋅ 2012/05/16 ⋅ 0

php生成xml简单实例代码

创建文档类型声明 一般而言,XML声明放在文档顶部。在PHP中声明十分简单:只需实例化一个DOM文档类的对象并赋予它一个版本号。查看程序清单A: 程序清单 A <?php // create doctype $dom = n...

逸舟 ⋅ 2011/04/14 ⋅ 0

PHP读写XML文件

PHP读写XML文件 author: MoreWindows blog: http://blog.csdn.net/MoreWindows KeyWord: PHP 解析XML DOMDocument XML文件操作 PHP可以方便的生成和读取XML文件。PHP主要通过DOMDocument、D......

长平狐 ⋅ 2012/12/10 ⋅ 0

ie和firefox操作table对象的异同

ie和firefox下操作table对象的异同【测试浏览器版本:ie为8,9,firefox为2.0】 1)在ie下,table标签直接使用appendChild增加document.createElement('tr')的行时不显示,但是在firefox下是没...

cookqq ⋅ 2013/06/25 ⋅ 0

Angularjs开发一些经验总结

在去年到今年参与了2个使用Angularjs作为客户端开发框架的项目开发。主要利用asp.net web api作为restfull服务提供框架和angularjs结合。Angularjs作为html的扩展,旨在建立一个丰富的动态w...

zting科技 ⋅ 2017/01/10 ⋅ 0

PHP读写XML文件

PHP读写XML文件 author: MoreWindows blog: http://blog.csdn.net/MoreWindows KeyWord: PHP 解析XML DOMDocument XML文件操作 PHP可以方便的生成和读取XML文件。PHP主要通过DOMDocument、D......

彭博 ⋅ 2012/04/12 ⋅ 0

使用PHP生成和获取XML格式数据

  在做数据接口时,我们通常要获取第三方数据接口或者给第三方提供数据接口,而这些数据格式通常是以XML或者JSON格式传输,本文将介绍如何使用PHP生成XML格式数据供第三方调用以及如何获取...

程序员农民工 ⋅ 2012/09/24 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

磁盘管理—逻辑卷lvm

4.10-4.12 lvm 操作流程: 磁盘分区-->创建物理卷-->划分为卷组-->划分成逻辑卷-->格式化、挂载-->扩容。 磁盘分区 注: 创建分区时需要更改其文件类型为lvm(代码8e) 分区 3 已设置为 Linu...

弓正 ⋅ 16分钟前 ⋅ 0

Spring源码解析(六)——实例创建(上)

前言 经过前期所有的准备工作,Spring已经获取到需要创建实例的 beanName 和对应创建所需要信息 BeanDefinition,接下来就是实例创建的过程,由于该过程涉及到大量源码,所以将分为多个章节进...

MarvelCode ⋅ 36分钟前 ⋅ 0

a href="#"

<a href="#">是链接到本页,因为你有的时候需要有个链接的样式,但是又不希望他跳转,这样写,你可以把这个页面去试试

颖伙虫 ⋅ 43分钟前 ⋅ 0

js模拟栈和队列

栈和队列 栈:LIFO(先进后出)一种数据结构 队列:LILO(先进先出)一种数据结构 使用的js方法 1.push();可以接收任意数量的参数,把它们逐个推进队尾(数组末尾),并返回修改后的数组长度。 2....

LIAOJIN1 ⋅ 43分钟前 ⋅ 0

180619-Yaml文件语法及读写小结

Yaml文件小结 Yaml文件有自己独立的语法,常用作配置文件使用,相比较于xml和json而言,减少很多不必要的标签或者括号,阅读也更加清晰简单;本篇主要介绍下YAML文件的基本语法,以及如何在J...

小灰灰Blog ⋅ 51分钟前 ⋅ 0

IEC60870-5-104规约传送原因

1:周期循环2:背景扫描3:自发4:初始化5:请求6:激活7:激活确认8:停止激活9:停止激活确认10:激活结束11:远程命令引起的返送信息12:当地命令引起的返送信息13:文件传送20:响应总召...

始终初心 ⋅ 今天 ⋅ 0

【图文经典版】冒泡排序

1、可视化排序过程 对{ 6, 5, 3, 1, 8, 7, 2, 4 }进行冒泡排序的可视化动态过程如下 2、代码实现    public void contextLoads() {// 冒泡排序int[] a = { 6, 5, 3, 1, 8, 7, 2, ...

pocher ⋅ 今天 ⋅ 0

ORA-12537 TNS-12560 TNS-00530 ora-609解决

oracle 11g不能连接,卡住,ORA-12537 TNS-12560 TNS-00530 TNS-12502 tns-12505 ora-609 Windows Error: 54: Unknown error 解决方案。 今天折腾了一下午,为了查这个问题。。找了N多方案,...

lanybass ⋅ 今天 ⋅ 0

IDEA反向映射Mybatis

1.首先在pom文件的plugins中添加maven对mybatis-generator插件的支持 ` <!-- mybatis逆向工程 --><plugin><groupId>org.mybatis.generator</groupId><artifactId>mybatis-generator-ma......

lichengyou20 ⋅ 今天 ⋅ 0

4.10/4.11/4.12 lvm讲解 4.13 磁盘故障小案例

准备磁盘分区 fdisk /dev/sdb n 创建三个新分区,分别1G t 改变分区类型为8e 准备物理卷 pvcreate /dev/sdb1 pvcreate /dev/sdb2 pvcreate /dev/sdb3 pvdisplay/pvs 列出当前的物理卷 pvremo...

Linux_老吴 ⋅ 今天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部