Element: Invalid handler for event "input": got undefined

Created on 15 Oct 2020  ·  5Comments  ·  Source: ElemeFE/element

 <div class="zysoft-table-select">
                <el-form ref="tableForm" model={ this.formModel } inline={ this.inline } label-position={this.labelPosition} disabled={ this.isDisabled } class="zysoft-form-serch" label-width={ this.labelWidth} size="mini">
                    <el-row gutter={20}>
                        { this.generateCode() }
                        <el-col xs={12} sm={3} md={4} lg={{span: '4-8'}} xl={{span: '4-8'}}>
                            <el-button type="primary" size="mini" >查询</el-button>
                            <el-button type="success" size="mini">重置</el-button>
                        </el-col>
                    </el-row>
                </el-form>
</div>

增加mode后

[Vue warn]: Invalid handler for event "input": got undefined

Most helpful comment

终极解决方案 传参方式需要{...props:{}}

render(h){
        return(
            <div class="zysoft-table-select-meet-frame">
                <el-form ref="tableForm"
                    class="zysoft-form-serch"  
                    {...{props: {
                        model: this.formModel,////vue jsx element 表单校验的model不可以直接写 以这种方式解决
                        inline: this.inline, 
                        labelPosition:this.labelPosition,
                        disabled: this.isDisabled,
                        labelWidth: this.labelWidth,
                        size: this.size
                    } } }
                    >
                    <el-row gutter={20}>
                        { this.generateCode() }
                        { this.$slots.select } 
                    </el-row>
                </el-form>
            </div>
        )
    }

All 5 comments

临时解决 : 可以在 el-form上加 on-input={()=>{}} 解决 让他的input有事件就不会报错了

临时解决 : 可以在 el-form上加 on-input={()=>{}} 解决 让他的input有事件就不会报错了

同遇到这个问题,亲测有效,这是bug吗

终极解决方案 传参方式需要{...props:{}}

render(h){
        return(
            <div class="zysoft-table-select-meet-frame">
                <el-form ref="tableForm"
                    class="zysoft-form-serch"  
                    {...{props: {
                        model: this.formModel,////vue jsx element 表单校验的model不可以直接写 以这种方式解决
                        inline: this.inline, 
                        labelPosition:this.labelPosition,
                        disabled: this.isDisabled,
                        labelWidth: this.labelWidth,
                        size: this.size
                    } } }
                    >
                    <el-row gutter={20}>
                        { this.generateCode() }
                        { this.$slots.select } 
                    </el-row>
                </el-form>
            </div>
        )
    }

临时解决 : 可以在 el-form上加 on-input={()=>{}} 解决 让他的input有事件就不会报错了

同遇到这个问题,亲测有效,这是bug吗

终极解决方案 { ...props:{}}

render(h){
        return(
            <div class="zysoft-table-select-meet-frame">
                <el-form ref="tableForm"
                    class="zysoft-form-serch"  
                    {...{props: {
                        model: this.formModel,////vue jsx element 表单校验的model不可以直接写 以这种方式解决
                        inline: this.inline, 
                        labelPosition:this.labelPosition,
                        disabled: this.isDisabled,
                        labelWidth: this.labelWidth,
                        size: this.size
                    } } }
                    >
                    <el-row gutter={20}>
                        { this.generateCode() }
                        { this.$slots.select } 
                    </el-row>
                </el-form>
            </div>
        )
    }

这个bug 官方不管了吗?

Was this page helpful?
0 / 5 - 0 ratings