iview table 單選的問題

 

<template>
    <div>
        <Card>
            <Row>
                <Col>
                    <Table border ref="selection" :data="data" :columns="columns"></Table>
                </Col>
            </Row>
        </Card>
    </div>
</template>

<script>
export default {
    data () {
        return {
            data: [
                {
                    name: '1',
                    select: false
                },
                {
                    name: '2',
                    select: false
                },
                {
                    name: '3',
                    select: false
                },
                {
                    name: '4',
                    select: false
                }
            ],
            columns: [
                {
                    title: 'select',
                    width: 60,
                    render: (h, params) => {
                        return h('Checkbox', {
                            props: {
                                value: params.row.select
                            },
                            on: {
                                'on-change': (val) => {
                                    this.data.map(x => {
                                        x.select= false;
                                        return x;
                                    });
                                    this.data[params.index].select= val;
                                }
                            }
                        });
                    }
                },
                {
                    title: 'name',
                    key: 'name'
                }
            ]
        };
    },
    methods: {
    },
    created () {
    }
};
</script>

<style scoped>

</style>