<el-table-column
  label="链接地址"
  align="center"
  prop="linkAddress"
  :show-overflow-tooltip="true"
  >
    <template scope="scope">
       <el-link type="primary" :underline="false" :href="scope.row.linkAddress" target="_blank">{{ scope.row.linkAddress }}</el-link>
    </template>
</el-table-column>

上述方法如果不是完整的url链接只是像下图一样的写法那链接并不会跳转到对应页面

 点击后地址就变成了这样:http://localhost:82/dev/www.baidu.com  他直接走的路由地址这样就触发了若依的404页面

 这样的话只要进行字符串拼接即可

<el-table-column
   label="链接地址"
   align="center"
   prop="linkAddress"
   :show-overflow-tooltip="true"
   >
     <template scope="scope">
        <el-link type="primary" :underline="false" :href="'http://'+ scope.row.linkAddress" target="_blank">{{ scope.row.linkAddress }}</el-link>
     </template>
</el-table-column>

这样就可以正常跳转了

注:记录遇到的问题学习使用,侵权立删

更多推荐