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. rpm环境安装dpkg包管理工具

    rpm环境安装dpkg包管理工具 索引:dpkg-scanpackages.dpkg.dpkg-query.dpkg-source.dpkg-scansource 在centos.redhat.麒麟服 ...

  2. JavaScript合集(流程控制语句)

    流程控制 条件判断语句 条件分支语句 循环语句 条件判断语句 if语句 语法: if(条件表达式){ 语句 } ------- if(a > 10){ alert('a比10大') } if-e ...

  3. 4.4:Sqoop数据导入实验

    〇.概述 1.拓扑结构 2.目标 使用sqoop工具将数据从mysql数据库导入到HDFS和Hbase 一.配置免密登录hdfs 三.导入到hdfs中 sqoop import --connect j ...

  4. JavaEE Day10 JavaScript高级

    今日内容 JavaScript ECMAScript:客户端脚本语言标准() BOM对象 DOM对象 事件 学习顺序:DOM-事件-BOM-DOM 一.简单入门 1.DOM 功能:控制HTML文档的内 ...

  5. TCP\UDP协议 socket模块

    目录 传输层主要协议 TCP协议 三次握手 TCP协议反馈机制 四次挥手 洪水攻击 UDP协议 socket模块 socket代码简介 socket.socket() server.bind() se ...

  6. APICloud 平台常用技术点汇总讲解

    ​  平台介绍: 使用 APICloud 可以开发移动APP.小程序.html5 网页应用.如果要实现编写一套代码编译为多端应用(移动APP.小程序.html5 ),需使用 avm.js  框架进行开 ...

  7. 2021 & 2022年终回顾:山河无恙,烟火寻常

    前言 又到了一年一度年终回顾的时候了,回想起去年年底圣诞节的时候由于忙着参加黑客松大赛,一下子就进入了新的一年,失去了年终回顾的动力,所以今年提前两个月开始进行回顾,这样的话今年最后一天就可以顺利发文 ...

  8. GeoLayout: Geometry Driven Room Layout Estimation Based on Depth Maps of Planes

    1. 论文简介 论文题目:GeoLayout: Geometry Driven Room Layout Estimation Based on Depth Maps of Planes Paper地址 ...

  9. UnoCSS 简化 CSS 的书写,Nice!

    CSS 样式太多,重复写 在学习 UnoCSS 之前,我提出几个问题: 你是否有过写完了 HTML 之后,跳转到 style 写 CSS 这样来回跳转的痛苦? 你是否有过不知道如何给节点取类名的痛苦( ...

  10. 【力扣】剑指 Offer II 092. 翻转字符

    题目 解题思路 一个很暴力的想法,在满足单调递增的前提下,使每一位分别取 1 或 0,去看看哪个结果小. 递归函数定义int dp(StringBuilder sb, int ind, int pre ...