zoukankan      html  css  js  c++  java
  • render iview tab select的添加和input的添加

    单选 && 多选 select

    {
                        title: '班组',
                        key: 'shift',
                        render: (h, params) => {
                            // const _this = this
                            // let values = params.row.values.name;
                            // debugger
                            return h('div', [
                                h('Select', {
                                    props: {
                                        value: '',//多选的话这里就是数组[]
                                        multiple: true
                                    },
                                    on: {
                                        'on-change': (event) => {
                                            console.log(event);
                                        }
                                    },
                                    style: {
                                         '80px'
                                    }
                                },
                                this.shiftGroup.map(item => {
                                    return h('Option', {
                                        props: {value: item.name, key: item.id}
                                    }, item);
                                })
                                )
                            ]);
                        }
                    }
                ],

    input的添加

    {
                        title: '排序',
                        key: 'sortNum',
                        sortable: true,
                        align: 'center',
                         80,
                        render: (h, params) => {
                            return h('div', [
                                h('Input', {
                                    props: {
                                        type: 'text',
                                        value: this.tableData[params.index].sortNum
                                    },
                                    style: {
                                         '50px',
                                        textAlign: 'center'
                                        // marginRight: '5px'
                                    },
                                    on: {
                                        'on-enter': (val) => {
                                            console.log(val.target.value)
                                            // this.dataRow = params.row;
                                            const param = {
                                                id: params.row.id,
                                                code: params.row.code,
                                                name: params.row.name,
                                                parentId: params.row.parentId,
                                                navUrl: params.row.navUrl,
                                                iconUrl: params.row.iconUrl,
                                                sortNum: val.target.value,
                                                remark: params.row.remark,
                                                state: params.row.state === '启用' ? 1 : 0
                                            }
                                            // debugger
                                            this.$post(api.SaveModulemanager(), param).then((res) => {
                                                // debugger
                                                let content = res.data;
                                                if (content.status === 200) {
                                                    this.isUpdateTreeData = true;
                                                    this.getModuleList('');
                                                    console.log('编辑成功');
                                                }
                                            });
                                            // console.log(params);
                                        }
                                    }
                                })
                            ]);
                        }
                    },
  • 相关阅读:
    索引失效原因总结
    Kafka、RabbitMQ、RocketMQ等消息中间件的介绍和对比
    一次JVM OOM问题的解决
    Java 如何有效地避免OOM:善于利用软引用和弱引用
    一个java内存泄漏的排查案例
    http的理解
    session和cookie区别
    数据库4种范式
    数据库的四种隔离级别
    C++malloc/free与new/delete的区别
  • 原文地址:https://www.cnblogs.com/haonanya/p/9204801.html
Copyright © 2011-2022 走看看