Vue在表格单元格（el-table-column）中添加超链接访问

<el-table-column show-overflow-tooltip label="操作"><template slot-scope="scope"><span class="span-text" v-if="scope.row.linkUrl!== undefined && scope.row.linkUrl.length >=1"&g

乡野码夫

8285人浏览 · 2021-02-07 22:15:22

乡野码夫 · 2021-02-07 22:15:22 发布

<el-table-column show-overflow-tooltip label="操作">
  <template slot-scope="scope">
	<span class="span-text" v-if="scope.row.linkUrl!== undefined && scope.row.linkUrl.length >=1"><a link :href="scope.row.linkUrl" target="_blank">办理</a></span>
	<span class="span-text" v-if="scope.row.guideLink!== undefined && scope.row.guideLink.length >=1"><a link :href="scope.row.guideLink" target="_blank">指南</a></span>
  </template>
</el-table-column>

注意： < template slot-scope=“scope”>的scope是自定义的变量，scope.row.一定根据自定义变量+.row是固定的。

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^