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. TICS端到端实践:企业积分查询作业开发

    摘要:本次TICS端到端体验,将以一个"小微企业信用评分"的场景为例. 本文分享自华为云社区<基于华为隐私计算产品TICS实现端到端的企业积分查询作业[玩转华为云]>, ...

  2. CANN 5.0硬核技术抢先看

    摘要:2021年12月,CANN5.0版本也将与大家正式见面,通过软硬件协同优化,该版本将会实现训练性能再翻倍,凭实力展现AI领域的「中国速度」! 本文分享自华为云社区<CANN 5.0硬核技术 ...

  3. Spring解决泛型擦除的思路不错,现在它是我的了。

    你好呀,我是歪歪. Spring 的事件监听机制,不知道你有没有用过,实际开发过程中用来进行代码解耦简直不要太爽. 但是我最近碰到了一个涉及到泛型的场景,常规套路下,在这个场景中使用该机制看起来会很傻 ...

  4. 【短道速滑二】古老的基于亮度平均值的自动Gamma校正算法。

    在github上搜索代码Auto Gamma Correction,找到一个比较古老的代码,详见:https://github.com/PedramBabakhani/Automatic-Gamma- ...

  5. 用ChatGPT 玩转哔哩哔哩

    用ChatGPT 玩转哔哩哔哩 哔哔终结者 BibiGPT 哔哩哔哩 BiliGPT,一款智能AI工具,帮助用户一键总结 哔哩哔哩视频内容,非常省心,软件基于GPT-3.5 AI,如果无法使用,可以使 ...

  6. BOM批量查询

     1业务要求 1.当多层展开时: 根据"BOM应用程序"字段CAPID在TC04中取出"选择ID"TC04-CSLID: 再根据TCS41-CSLID= TC0 ...

  7. Python使用pandas库读取txt文件中的Json数据,并导出到csv文件

    使用的是 Python 3 代码: #!/usr/bin/python # -*- coding: gbk -*- # JSON数据导出到csv文件 import json import pandas ...

  8. OKR之剑·实战篇06:OKR致胜法宝-氛围&业绩双轮驱动(下)

    作者:vivo 互联网平台产品研发团队 本文是<OKR 之剑>系列之实战第 6 篇-- 本文介绍团队营造氛围的方法与实践.在业绩方面的探索与输出,在两方面分别总结了一些经验分享给大家. 一 ...

  9. 【收藏】Stable Diffusion 制作光影文字效果

    大家对于最近 Stable Diffusion 不断出新的视觉"整活"印象都很深刻,很多人对最近比较流行的制作光影文字很感兴趣,制作光影文字可以作为进阶 Stable Diffus ...

  10. springboot 参数通过 @RequestBody传递的写法

    controller中有时候参数是使用 @RequestBody传递的这种怎么写? 直接上代码 @RequestMapping("/test") public void getAc ...