1.h函数的三个参数

第一个参数是必须的。
类型:{String | Object | Function}
一个 HTML 标签名、一个组件、一个异步组件、或一个函数式组件。
是要渲染的html标签。
第一个参数div 是表示创建一个div的元素 第二个参数是可选的。
类型:{Object} 主要是当前html中的各种属性。
如attrs,class,style等
在开发时。建议传,实在没有传的时候,传入 null 第三个参数可选的。
类型:{String | Array | Object} children
虚拟子节点(vnodes),当前html标签的元素。
export default{
data(){
return{
}
},
render(h){
let that=this;//为了防止this的指向发生改变
console.log("render中的this", this);//Proxy {}对象
return h('input',{
// wa你想咋个命名就怎样
wa:{
value: that.value,//获取值
},
// 事件on,用来监听input事件
on:{
'input':function(event){
that.$emit('input',event.target.value)
}
}
}
);
}
}

在使用的页面中

import aa from "./myrender"

   <aa v-model="name"></aa>
{{name}} data(){
return{
name:"",
}
} components:{
aa
}

vue在render函数中如何实现v-model和事件绑定(4)的更多相关文章

  1. 使用React.Fragment替代render函数中div的包裹

    1.在 React 中,render 函数中 return 的内容只能有一个根节点,如果多个元素嵌套,需要用一个标签元素包裹 这个包裹的标签通常用 div,示例如下: class App extend ...

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

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

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

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

  4. MVVM设计模式和WPF中的实现(四)事件绑定

    MVVM设计模式和在WPF中的实现(四) 事件绑定 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在WPF中 ...

  5. MVVM设计模式和在WPF中的实现(四) 事件绑定

    系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在WPF中的实现(三)命令绑定 MVVM模式解析和在WPF中的 ...

  6. vue之Render函数

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

  7. vue监听页面中的某个div的滚动事件,并判断滚动的位置

    在开发中常常会遇到这样一个vue页面,页面分为左右两部分,左边是目录树,右边是一个类名为xq-box的div,在xq-box中多个div上下并列布局,每个div中的内容就对应着左边目录树中的相应节点, ...

  8. js 函数定义的两种方式以及事件绑定(扫盲)

    一.事件(例如:onclick)绑定的函数定义放在jsp前面和放后面没影响 二. $(function() { function func(){}; }) onclick通过如下方式绑定事件到jsp中 ...

  9. angularjs学习之六(angularjs中directive指令的一般编程事件绑定 模板使用等)

    angular js 中模板的使用.事件绑定以及指令与指令之间的交互 相应教学视频地址(需FQ):v=aG8VD0KvUw4">angularjs教学视频 <!doctype h ...

  10. WPF中使用System.Windows.Interactivity实现事件绑定的替代方法

    一.问题描述 对于 Button 等控件,在 MVVM 中我们能通过 Command 绑定解决 Click 事件.具体如下所示: <Button Margin="10" He ...

随机推荐

  1. 艾莫尔研究院基于Karmada的落地实践

    摘要:本文从企业的业务背景.应用需求以及选择Karmada前后的对比和收益等方面,阐述了艾莫尔使用多集群技术完成企业技术升级的过程. 本文分享自华为云社区<艾莫尔研究院基于Karmada的落地实 ...

  2. 混合编程:如何用pybind11调用C++

    摘要:在实际开发过程中,免不了涉及到混合编程,比如,对于python这种脚本语言,性能还是有限的,在一些对性能要求高的情景下面,还是需要使用c/c++来完成. 本文分享自华为云社区<混合编程:如 ...

  3. vue2升级vue3:单文件组件概述 及 defineExpos/expose

    像我这种react门徒被迫迁移到vue的,用管了TSX,地vue 单文件组件也不太感冒,但是vue3 单文件组件,造了蛮多api ,还不得去了解下 https://v3.cn.vuejs.org/ap ...

  4. HBuilderX获取iOS证书的打包步骤

    简介: 目前app开发,很多企业都用H5框架来开发,而uniapp又是这些h5框架里面最成熟的,因此hbuilderx就成为了开发者的首选.然而,打包APP是需要证书的,那么这个证书又是如何获得呢? ...

  5. Intellij 查找排除JAR包的依赖关系(Maven Helper)

    Intellij 查找排除JAR包的依赖关系(Maven Helper) 安装插件 Windows 类似

  6. websocket群聊实战

    演示及源码地址: 演示地址:https://www.wchime.xyz/#/ 后端代码:https://gitee.com/mom925/wchime-web-api 前端代码:https://gi ...

  7. 【Boost】Windows 下个人在配置 Boost 踩到的坑以及解决方案

    要编译的 Boost 版本:1.82.0 假设 Boost 的根目录为 ${boost_root}$ 如果不想编译可以使用博主编译后的Boost:https://pan.baidu.com/s/1s2 ...

  8. CH#17C 舞动的夜晚(最大流+强连通分量)

    舞动的夜晚 CH Round #17 描述 L公司和H公司举办了一次联谊晚会.晚会上,L公司的N位员工和H公司的M位员工打算进行一场交际舞.在这些领导中,一些L公司的员工和H公司的员工之间是互相认识的 ...

  9. shell脚本(15)-sed命令

    文档目录一.sed-简介1.shell对文件操作介绍2.sed命令简介3.sed语法: sed [options] '{command}{flags}' [filename]二.sed-命令选项( - ...

  10. 【南大静态代码分析】作业 2:常量传播和 Worklist 求解器

    作业 2:常量传播和 Worklist 求解器 题目链接:https://tai-e.pascal-lab.net/pa2.html 评测链接:https://oj.pascal-lab.net/pr ...