vue组件的对象式写法,vue中的h函数
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函数的更多相关文章
- vue组件定义方式,vue父子组件间的传值
vue组件定义方式,vue父子组件间的传值 <!DOCTYPE html> <html lang="zh-cn"> <head> <met ...
- webapck搭建环境,让你知道vue中的h函数的作用和虚拟节点如何上树!
搭建环境 npm init 初始化项目 npm i -D snabbdom 安装 npm i -D webpack@5 webpack-cli@3 webpack-dev-server@3 简单介绍 ...
- 【Vue】详解Vue组件系统
Vue渲染的两大基础方式 new 一个Vue的实例 这个我们一般会使用在挂载根节点这一初始化操作上: new Vue({ el: '#app' }) 注册组件并使用—— 全局注册 通过Vue.comp ...
- vue2.0 如何自定义组件(vue组件的封装)
一.前言 之前的博客聊过 vue2.0和react的技术选型:聊过vue的axios封装和vuex使用.今天简单聊聊 vue 组件的封装. vue 的ui框架现在是很多的,但是鉴于移动设备的复杂性,兼 ...
- Vue系列之 => vue组件创建
创建方式 一 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...
- VUE组件 单独文件封装
https://www.cnblogs.com/SamWeb/p/6391373.html vuejs 单文件组件.vue 文件 vuejs 自定义了一种.vue文件,可以把html, css, ...
- 关于vue组件的一个小结
用vue进行开发到目前为止也有将近一年的时间了,在项目技术选型的时候隔壁组选 react的时候我们坚持使用vue作为前端的开发框架.虽然两者思想上的差异不大,但是vue的语法在代码的可读性以及后期的维 ...
- vue组件创建的三种方式
1.使用Vue.extend创建全局的Vue组件 //1.1 使用vue.extend创建组件 var com1 = Vue.extend({ //通过template属性指定组件要展示的html结构 ...
- 移动端无限滚动 TScroll.vue组件
// 先看使用TScroll.vue的几个demo 1.https://sorrowx.github.io/TScroll/#/ 2. https://sorrowx.github.io/TScrol ...
- VUE组件汇总
内容 UI组件 开发框架 实用库 服务端 辅助工具 应用实例 Demo示例 UI组件 element ★13489 - 饿了么出品的Vue2的web UI工具套件 Vux ★8133 - 基于Vue和 ...
随机推荐
- Spark通过打jar包形式提交任务
idea构建项目 创建一个maven项目,配置pom依赖,以及scala编译插件. 注意一定要保证,你的scala版本和spark版本和要提交的集群版本一致,要不很多莫名其妙的问题,scala如果你在 ...
- 学习ASP.NET Core Blazor编程系列十——路由(下)
学习ASP.NET Core Blazor编程系列一--综述 学习ASP.NET Core Blazor编程系列二--第一个Blazor应用程序(上) 学习ASP.NET Core Blazor编程系 ...
- jsp 页面返回、本页面刷新
返回上一页面: window.history.go(-1); //返回上一页window.history.back(); //返回上一页 返回上一页面并对上一页面刷新: history.go(-1 ...
- day22 存储过程 & 游标 & 事务
存储过程 是一种在数据库中存储复杂程序(复杂sql语句),以便外部程序调用的一种数据库对象 存储过程是为了完成特定功能的sql语句集,经编译创建并保存在数据库中,用户可以通过指定存储过程的名字并给定参 ...
- 现代 CSS 之高阶图片渐隐消失术
在过往,我们想要实现一个图片的渐隐消失.最常见的莫过于整体透明度的变化,像是这样: <div class="img"></div> div { width: ...
- forms组件源码剖析
一:forms组件源码剖析 1.forms组件源码切入点: 1.0 form_obj.is_valid() 2.0 def is_valid(self): """ Ret ...
- windows装机小经验
小白的装机之路 大学时有试过自己用硬盘装,但只知其然,不知其所以然,真出现什么问题也不知道怎么解决,作为一名码农还是好好补补知识,免得以后被人笑话. 经过自己的看各路大神文章,试验并总结以下粗浅见解. ...
- 数据库日志——binlog、redo log、undo log扫盲
日志是数据库中比较重要的组成部分,很多核心的功能必须依靠日志才能完成. 该篇文章简要介绍了binlog.redo log与undo log,能够在一定程度上拓宽对mysql日志的整体认识. binlo ...
- DVWA靶场实战(一)——Brute Force
DVWA靶场实战(一) 一.Brute Force: 1.漏洞原理: Brute Force是暴力破解的意思,大致原理就是利用穷举法,穷举出所有可能的密码. 2.攻击方法: Burpsuite中的In ...
- day03-Spring管理Bean-IOC-01
Spring管理Bean-IOC 1.Spring配置/管理bean介绍 Bean管理包括两方面: 创建bean对象 给bean注入属性 Bean的配置方式: 基于xml文件配置方式 基于注解配置方式 ...