form-create

绑定事件

例如给i-input组件添加on-change事件,事件名称参考Input

{
    type:'input',
    field: 'test',
    title: 'test',
    value: '',
    on: {
        'on-change': function(){
            console.log('value 发生变化');
        }
    }
}

通过 emit 方式绑定事件

只支持在组件模式下

//rule
[{
     type:'input',
     field: 'test',
     title: 'test',
     value: '',
     emit: ['on-change']
 }]

事件名称为${field}-${eventName}

<form-create :rule="rule" @test-on-change="onChange"> </form-create>

通过 emitPrefix 自定义事件前缀

//rule
[{
     type:'input',
     field: 'test',
     title: 'test',
     value: '',
     emit: ['on-change'],
     emitPrefix: 'xaboy',
 }]

事件名称为${emitPrefix}-${eventName}

<form-create :rule="rule" @xaboy-on-change="onChange"> </form-create>

通过 on 方法绑定事件 1.0.2+

//rule
[{
     type:'input',
     field: 'test',
     title: 'test',
     value: '',
     emit: ['on-change'],
     emitPrefix: 'xaboy',
 }]

$f.on('xaboy-on-change',function(){
    //TODO
})

向事件中注入$f和自定义参数

//rule
[{
     type:'input',
     field: 'test',
     title: 'test',
     value: '',
     emit: [{
        name: 'on-change',
        inject: ['自定义参数,数据类型不限']
     }],
     emitPrefix: 'xaboy',
 }]

<form-create :rule="rule" @xaboy-on-change="onChange"> </form-create>

向事件中注入参数后,事件会额外增加一个参数

//未注入
{
    onChange: function(val){

    }
}
//注入后
{
    onChange: function(inject, val){

    }
}

inject 参数的数据结构

{
    $f:Object,//api
    rule:Array,//生成规则
    self:Object,//当前生成规则
    option:Object,//全局配置
    inject:Any,//自定义注入的参数
}

参数注入也可以通过全局配置项injectEvent:true开启

← 自定义布局 →