WishMeLz

生活其实很有趣

TSX 代码片段

Table

排序

onSortChange={this.sortChange}

ortChange(val: any) {
    if (val.order) {
            this.params.orderField = val.prop
            this.params.orderRule = val.order == 'descending' ? 'desc' : 'asc'
        } else {
            this.params.orderField = ''
            this.params.orderRule = ''
        }
     this.getList()
}

格式化

columnFormatter={this.columnFormatter}
   columnFormatter(row: any, column: any, cellValue: any, index: number) {
        let value
        switch (column.property) {
            case 'operation':
                value = (
                    <div class="operate">
                        <el-button
                            onClick={() => this.openEdit(row)}
                            type="text"
                            size="small"
                        >
                            编辑
                        </el-button>
                        <el-button
                            onClick={() => this.deleteRow(row)}
                            type="text"
                            size="small"
                            style="color:red"
                        >
                            删除
                        </el-button>
                    </div>
                )
                break
            default:
                value = cellValue
                break
        }
        return value
    }

复选框 多选

 {
        label: '多选',
        type: 'selection',
 },

//是否可选择
selectable={this.selectable}
selectable(row: any, index: number) {
     if (row.isValid === EFileStatusKey.EFFECT) {
            return true
     } else {
            return false
     }
}

//选中回调
 onSelectionChange={(rows: any) => {
    this.selectionChange(rows)
 }}
 selectionChange(rows: any) {
        this.multipleList = rows
 }

Form

ref

@Ref('formRef') public readonly formRef: any

键盘事件

回车搜索

nativeOnKeyup={this.searchKeyup}
searchKeyup(event: KeyboardEvent) {
        if (event.key === 'Enter') {
        }
}