1.h函数的三个参数

第一个参数是必须的。
类型:{String | Object | Function}
一个 HTML 标签名、一个组件、一个异步组件、或一个函数式组件。
是要渲染的html标签。
第一个参数div 是表示创建一个div的元素 第二个参数是可选的。
类型:{Object} 主要是当前html中的各种属性。
如attrs,class,style等
在开发时。建议传,实在没有传的时候,传入 null 第三个参数可选的。
类型:{String | Array | Object} children
虚拟子节点(vnodes),当前html标签的元素。

使用attrs属性就可以绑定id

render函数如何绑定class 使用关键字class

render函数如何绑定style 使用关键字 style

export default{
data(){
return{
}
},
render(h){
return h('div',{
attrs:{
id:"box"
},
class:{
'demo':true
},
style:{
'color':"red"
},
},
"这是一个div元素"
);
}
}
// render函数中如何绑定一个事件
// on: {
// 'click': function(event) {
// console.log(event)
// }
// } // render如何添加事件修饰符 ~ 只会执行一次
// on: {
// '~click': function(event) {
// console.log(event)
// }
// } 这下面的方法这一个没有被实践过 不知道
// on:{
// 'click':function(event){
// event.stopPropgation();//阻止默认事件
// event.stopPrevent();
// event.target===event.target.current //点击的当前元素
// }
// }

vue中render函数使用attrs绑定id、class、style、事件(5)的更多相关文章

  1. vue iview render里面 没有双向绑定 renderHeader 要序列化 反序列 一下

    vue iview render里面 没有双向绑定 renderHeader 要序列化 反序列 一下 renderHeader: (h, params) => { return [ h('Rad ...

  2. vue中watch函数的用法

    vue中watch函数: 不仅可以判断路由变化(上篇博客有介绍),还可以判断数据的变化 (1):首先写watch函数 (2):在data里定义值 (3):在methods里写方法 (4):使用值

  3. 终于搞懂了vue 的 render 函数(一) -_-|||

    终于搞懂了vue 的 render 函数(一) -_-|||:https://blog.csdn.net/sansan_7957/article/details/83014838 render: h ...

  4. vue 定义全局函数,监听android返回键事件

    vue 定义全局函数,监听android返回键事件 方法一:main.js 注入(1)在main.js中写入函数Vue.prototype.changeData = function (){ aler ...

  5. vue之Render函数

    (1)什么是Render函数 先来看一个场景,在博客网中,一般有一级标题.二级标题.三级标题...,为了方便分享url,它们都做成了锚点,点击后,会将内容加载网址后面,以#分隔. 例如‘特性’是一个& ...

  6. Vue中MVVM模式的双向绑定原理 和 代码的实现

      今天带大家简单的实现MVVM模式,Object.defineProperty代理(proxy)数据   MVVM的实现方式: 模板编译(Compile) 数据劫持(Observer) Object ...

  7. Vue中render: h => h(App)的含义

    // ES5 (function (h) { return h(App); }); // ES6 h => h(App); 官方文档 render: function (createElemen ...

  8. vue中render: h => h(App)的详细解释

    2018年06月20日 10:54:32 H-L 阅读数 5369   render: h => h(App) 是下面内容的缩写:   render: function (createEleme ...

  9. vue中的$props、$attrs和$listeners研究 [包装iview组件]

    $props:当前组件接收到的 props 对象.Vue 实例代理了对其 props 对象属性的访问. $attrs:包含了父作用域中不作为 prop 被识别 (且获取) 的特性绑定 (class 和 ...

  10. 关于 Vue 中 h() 函数的一些东西

    最近在项目上需要一个信息弹窗,来显示信息.一开始只让它弹出了文字,而且只有一条信息.而给我的需求是多条文字和图片,而后我使用了element ui中的 Notification 通知组件来显示.当然, ...

随机推荐

  1. 云图说|初识云数据库GaussDB(for Redis)

    阅识风云是华为云信息大咖,擅长将复杂信息多元化呈现,其出品的一张图(云图说).深入浅出的博文(云小课)或短视频(云视厅)总有一款能让您快速上手华为云.更多精彩内容请单击此处. 摘要:云数据库Gauss ...

  2. ImproperlyConfigured('SQLite 3.8.3 or later is required Centos升级SQLite

    遇到这个错误可以选择给django降级,不建议 这里选择升级SQLite 1.查看版本 sqlite3 --version 2.Centos7安装最新的sqlite3 wget https://www ...

  3. iOS App 上架流程图文教学

    在上架 App 之前必须先准备好开发者帐号,但申请开发者帐号因法兰克早在之前已经申请好了,故就跳过此步骤,直接从产生凭证到上传 App 开始讲起.首先,要将自己辛苦写好的 App 送审的话,则要依序做 ...

  4. Python异步编程之yield from

    yield from 简介 yield from 是Python3.3 后新加的语言结构,可用于简化yield表达式的使用. yield from 简单示例: >>> def gen ...

  5. C# 实用第三方库

    C# 实用第三方库 Autofac 依赖注入IOC框架 NuGet安装:Autofac.Autofac.Extras.DynamicProxy AutoMapper 对象映射 Mapster 对象映射 ...

  6. C#9.0:Improved Pattern Matching

    增强的模式匹配 C#9.0添加了几种新的模式.我们可以参阅模式匹配教程 ,来了解下面代码的上下文: 1 public static decimal CalculateToll(object vehic ...

  7. Spring 学习笔记(3)控制反转 IoC

    本篇文章主要对 Spring 框架中的核心功能之一控制反转 (IOC,Inversion of Control)进行介绍,采用理论 + 实战的方式给大家阐述其中的原理以及明确需要注意的地方. 控制反转 ...

  8. POJ1426: Find The Multiple

    题目: 给定一个正整数n,请编写一个程序来寻找n的一个非零的倍数m,这个m应当在十进制表示时每一位上只包含0或者1.你可以假定n不大于200且m不多于100位. 提示:本题采用Special Judg ...

  9. 题解 [HDU6746] Civilization(贪心+模拟)

    来源:2020 年百度之星·程序设计大赛 - 初赛一 一道贪心 + 细节模拟题 题意很简单,这里不详细写了 观察题目,\(n\) 只有 500 ,可以 \(n \times n\) 枚举每个位置作为起 ...

  10. poi 4.11版本 word模板操作

    写代码之前先说说遇到的问题,之前word模板是使用poi 3.9的包实现的,之后又写了exlce上传下载的功能使用的是poi 4.11的版本,他们之间融合的时候发现包冲突,总有一个功能不能使用,之后发 ...