方式一:
<el-table-column prop="shopUrl" label="购买地址" align="left" width="220">
<template slot-scope="scope">
<a target="_blank" :href="scope.row.shopUrl" style="white-space:nowrap"><u>{{scope.row.shopUrl}}</u></a>
</template>
</el-table-column>
target="_blank" 标签打开新网页
方式二:
<el-table-column prop="shopUrl" label="购买地址" align="left" width="220">
<template slot-scope="scope">
<el-button size="mini" type="text" style="width: 120px;" @click="jumpView(scope.row.shopUrl)">
<span style="white-space:nowrap"><u>{{scope.row.shopUrl}}</u></span>
</el-button>
</template>
</el-table-column>
jumpView(url){//跳转购买网址
console.log('跳转购买网址=======start:'+url)
//window.location = url;//当前页跳转新网页
window.open(url);//打开新网页跳转至新网页
},
效果: