页面跳转传参(1)

背景:

跳转前代码:未显示蓝色字体以及点击无效

columns: [
                    {key: 'licPltNo', title: '车牌号', width: 80, fixed: 'left'},
                   …………               
                    {
                        key: 'operation',
                        title: '充电明细',
                        align: 'center',
                        width: 70,
                        fixed: 'right',                       
                    }
 ],

注释:
fixed: 列是否固定在左侧或者右侧,可选值为 left 左侧和 right 右侧

代码修改:

columns: [
                    {key: 'licPltNo', title: '车牌号', width: 80, fixed: 'left'},
                   …………                   
                    {
                        key: 'operation',
                        title: '充电明细',
                        align: 'center',
                        width: 70,
                        fixed: 'right',
                        //两个参数:h   params
                        render: (h, params) => { 
                            return h('router-link', {
                                props: {
                                    to: {
                                        //跳转到【name】这个文件名的组件
                                        name: 'charge-detail',
                                        //query:请求参数(params中的请求参数)
                                        query: {
                                            orgIds: params.row.carId,
                                            beginTime: params.row.rcrdDate,
                                            endTime: params.row.rcrdDate
                                        }
                                    }
                                }
                            }, '详情');
                        }
                    }
                ],

注释:
1.render:自定义渲染列,使用 Vue 的 Render 函数。
2.props:动态传参

猜你喜欢

转载自blog.csdn.net/lgx19940508/article/details/83623133