让前端飞Web前端之路

说说如何在 element UI 的 Table 数据中加入跳转

2019-10-13  本文已影响0人  deniro

我们使用 Vue.js 的 slot-scope 特性,来实现加入跳转链接功能。

<template> 上使用特殊的 slot-scope 特性,可以接收传递给插槽的 prop 属性。

示例:

<el-table-column
        prop="name"
        label="任务"
        align="left"
        width="900"
>
   <template slot-scope="scope">
       <a :href="scope.row.url" target="_blank">
           {{scope.row.name}}
       </a>
   </template>
</el-table-column>

运行结果:


Vue.js v2.6.0 为具名插槽和作用域插槽引入了一个新的统一的语法,即 v-slot 指令。slot-scope 特性将从 Vue3 中移除。

上一篇 下一篇

猜你喜欢

热点阅读