美文网首页
render 函数

render 函数

作者: panw3i | 来源:发表于2018-05-23 21:13 被阅读14次
    
    <template>
    <div>
    
    
        <Table border :columns="columns7" :data="data6"></Table>
    
        
    </div>
    
    </template>
    <script>
        export default {
            data () {
                return {
                    columns7: [
                        {
                            title: 'Name',
                            key: 'name',
                            render: (h, params) => {
                                return h('div', [
                                    h('Icon', {
                                        props: {
                                            type: 'person'
                                        }
                                    }),
                                    h('strong', params.row.name)
                                ]);
                            }
                        },
                        {
                            title: 'Age',
                            key: 'age'
                        },
                        {
                            title: 'Address',
                            key: 'address'
                        },
                        {
                            title: 'Action',
                            key: 'action',
                            width: 150,
                            align: 'center',
                            render: (h, params) => {
                                return h('Poptip', {
                                        props:{
                                            title:"确定删除吗?",
                                            width:"200px",
                                            confirm:"trie"
                                        },
                                
                                        on: {
                                            "on-ok": ()=>{
                                                console.log(params)
                                                this.$Message.info(params);
                                            },
                                            "on-cancel":()=>{
                                                this.$Message.info('You click cancel');
                                            }
                                        }
    
                                },
                                
                                    [h('Button', {
                                        props: {
                                            type: 'error',
                                            size: 'small'
                                        },
                                         domProps: {
                                            innerHTML: '删除'
                                        },
                                    })
                                ]);
                            }
                        }
                    ],
                    data6: [
                        {
                            name: 'John Brown',
                            age: 18,
                            address: 'New York No. 1 Lake Park'
                        },
                        {
                            name: 'Jim Green',
                            age: 24,
                            address: 'London No. 1 Lake Park'
                        },
                        {
                            name: 'Joe Black',
                            age: 30,
                            address: 'Sydney No. 1 Lake Park'
                        },
                        {
                            name: 'Jon Snow',
                            age: 26,
                            address: 'Ottawa No. 2 Lake Park'
                        }
                    ]
                }
            },
        
        }
    </script>
    
    

    相关文章

      网友评论

          本文标题:render 函数

          本文链接:https://www.haomeiwen.com/subject/wpudjftx.html