【vue,iview中table的自定义render函数用法学习】

<!--
 * 版权所有:xxxxxxx技术有限公司
 * 描述:【vue,iview--》 table的自定义render函数用法学习】
 * 作者:wangjj
 * 版本          开发者            日期              描述
 * 1.0.0.0       wangjj          2019/09/25         新建
 -->
<template>
    <div>
        <Table :columns="columnsTab" :data="tableRent" :height="300" border stripe></Table>
    </div>
</template>


<script>
    export default {
        name: 'test',
        data () {
            return {
                //表格数据
                tableRent: [],
                //表格头栏
                columnsTab: [
                    {
                        title: '是否全免',
                        width: 100,
                        align: 'center',
                        key: 'rentFree',
                        render: (h, params) => {
                            return h('Checkbox', {
                                props: {
                                    value: params.row.rentFree
                                },
                                on: {
                                    'on-change': event => {
                                        /**
                                         * 判断是否多选,此处做逻辑处理,方法抽出去也可以
                                         */
                                        if (event) {

                                        } else {

                                        }
                                    }
                                }
                            });
                        }
                    }
                ]
            };
        },
        methods: {}

    };
</script>
<style scoped>

</style>

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章