当前位置: 首页 > Web前端 > vue.js

vue的render函数

时间:2023-03-31 17:38:45 vue.js

vue中Render函数应用流程:基于IviewButton组件的APIrender:(h,params)=>{returnh('div',[h('Button',{props:{type:'success',size:'small'},style:{marginRight:'5px'},on:{click:()=>{this.edit(params.index)}}},'modify'),h('Button',{props:{type:'error',size:'small'},style:{marginRight:'5px'},on:{click:()=>{this.del(params.index)}}},'delete')]);},render:(h,params)=>{returnh('div',[h('Button',{props:{type:'success',size:'small'},style:{marginRight:'5px'},on:{click:()=>{this.edit(params.index)}}},'edit'),h('Button',{props:{type:'error',size:'small'},style:{marginRight:'5px'},on:{click:()=>{this.del(params.index)}}},'delete')]);},切换组件渲染:(h,params)=>{returnh('i-switch',{props:{size:'large',value:params.row.show===1},scopedSlots:{open:()=>h('span','on'),关闭:()=>h('span','off')},on:{'on-change':(value)=>{console.log(params.index,value)}}});},关于为什么IviewUI框架的render功能按钮可以使用Button,但是switch是i-switch,我在Iveiw官网一探究竟,贴出官方解释如下图: