render:将虚拟dom转为真实dom

h函数:创建的是vnode,也可以成为createVnode函数

  语法:h(元素名称 ,这个元素的数据,子集)

  • 第一个参数:可以为一个html标签,一个组件,一个异步组件,或者是一个函数式组件。
  • 第二个参数:{ Object } Props,与attributes和props,以及事件对应的对象,我们可以在模板中使用,如果没有需要传入的属性,可以设置为null。
  • 第三个参数:{String | Object |Array}可以是字符串Text文本或者是h函数构建的对象再者可以是有插槽
// 组件的对象式写法

// 1 .vue 变为对象 ={} 

import {h} from "vue";

let Wfonction={

    // 创建一个组件 布局<div> <h2>内容</h2>  <div></div>div的内容</div>
    render(){   // render 就是把虚拟dom 变为 真实dom
return h("div",{id:"box"},h("h2",{},"内容"),h("div",{},"div的内容")) }
}

vue组件的对象式写法,vue中的h函数的更多相关文章

  1. vue组件定义方式,vue父子组件间的传值

    vue组件定义方式,vue父子组件间的传值 <!DOCTYPE html> <html lang="zh-cn"> <head> <met ...

  2. webapck搭建环境,让你知道vue中的h函数的作用和虚拟节点如何上树!

    搭建环境 npm init 初始化项目 npm i -D snabbdom 安装 npm i -D webpack@5 webpack-cli@3 webpack-dev-server@3 简单介绍 ...

  3. 【Vue】详解Vue组件系统

    Vue渲染的两大基础方式 new 一个Vue的实例 这个我们一般会使用在挂载根节点这一初始化操作上: new Vue({ el: '#app' }) 注册组件并使用—— 全局注册 通过Vue.comp ...

  4. vue2.0 如何自定义组件(vue组件的封装)

    一.前言 之前的博客聊过 vue2.0和react的技术选型:聊过vue的axios封装和vuex使用.今天简单聊聊 vue 组件的封装. vue 的ui框架现在是很多的,但是鉴于移动设备的复杂性,兼 ...

  5. Vue系列之 => vue组件创建

    创建方式 一 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  6. VUE组件 单独文件封装

    https://www.cnblogs.com/SamWeb/p/6391373.html vuejs 单文件组件.vue 文件   vuejs 自定义了一种.vue文件,可以把html, css, ...

  7. 关于vue组件的一个小结

    用vue进行开发到目前为止也有将近一年的时间了,在项目技术选型的时候隔壁组选 react的时候我们坚持使用vue作为前端的开发框架.虽然两者思想上的差异不大,但是vue的语法在代码的可读性以及后期的维 ...

  8. vue组件创建的三种方式

    1.使用Vue.extend创建全局的Vue组件 //1.1 使用vue.extend创建组件 var com1 = Vue.extend({ //通过template属性指定组件要展示的html结构 ...

  9. 移动端无限滚动 TScroll.vue组件

    // 先看使用TScroll.vue的几个demo 1.https://sorrowx.github.io/TScroll/#/ 2. https://sorrowx.github.io/TScrol ...

  10. VUE组件汇总

    内容 UI组件 开发框架 实用库 服务端 辅助工具 应用实例 Demo示例 UI组件 element ★13489 - 饿了么出品的Vue2的web UI工具套件 Vux ★8133 - 基于Vue和 ...

随机推荐

  1. UBOOT编译--- UBOOT编译过程目标依赖分析(八)

    1. 前言 UBOOT版本:uboot2018.03,开发板myimx8mmek240. 2. 概述 本文采用自顶向下的方法,从顶层目标开始到最原始的依赖. 3. u-boot编译 uboot的编译分 ...

  2. 比 JSON.stringify 快两倍的fast-json-stringify

    前言 相信大家对JSON.stringify并不陌生,通常在很多场景下都会用到这个API,最常见的就是HTTP请求中的数据传输, 因为HTTP 协议是一个文本协议,传输的格式都是字符串,但我们在代码中 ...

  3. java并发数据结构之CopyOnWriteArrayList

    CopyOnWriteArrayList是一个线程安全的List实现,其在对对象进行读操作时,由于对象没有发生改变,因此不需要加锁,反之在对象进行增删等修改操作时,它会先复制一个对象副本,然后对副本进 ...

  4. [数据结构][洛谷]P3375模板题 KMP

    主要还是KMP算法,上学期没学,只是考前抱了抱佛脚,也没怎么弄明白. 先放代码: //KMP #include <bits/stdc++.h>//万能头 using namespace s ...

  5. rpm和yum仓库

    一.rpm rpm从官网下,或者自研 外来的硬件设备连接到Linux上,必须挂载 rpm -qa(all) 显示当前系统中以 RPM 方式安装的所有软件列表 rpm -q 软件名 查询指定软件是否已安 ...

  6. 带你读AI论文丨针对文字识别的多模态半监督方法

    摘要:本文提出了一种针对文字识别的多模态半监督方法,具体来说,作者首先使用teacher-student网络进行半监督学习,然后在视觉.语义以及视觉和语义的融合特征上,都进行了一致性约束. 本文分享自 ...

  7. 浅谈 C++ 模板 & 泛化 (妈妈再也不用担心我不会用 std::sort 了)

    基础复习 先上个对 int 类型数组的插入排序: void insertionSort_01(int* seq, int firstIndex, int lastIndex) { for (int j ...

  8. Transition 初步使用

    Transition Vue 提供了 transition 的封装组件,在下列情形中,可以给任何元素和组件添加进入/离开过渡: 条件渲染 (使用 v-if) 条件展示 (使用 v-show) 动态组件 ...

  9. 使用idea进行gitee代码管理

    目录 1.在idea插件市场安装gitee插件 2.把本地仓库的release分支上的代码合到dev分支上 3.把本地dev分支上的代码合到远程dev分支上去 1.在idea插件市场安装gitee插件 ...

  10. Js生成图片验证码

    上代码 /** * [使用说明] * 1.生成验证码 * 函数: * generateRandomCode( dom对象Id ); * 例: * generateRandomCode( 'id' ); ...