vue 点击实现跳转到外部链接
以下是一个被封装的box组件,在父组件中点击该组件可以实现打开一个新页面:
Box.vue
1 <template> 2 <div class="box"> 3 <div class="grid-content bg-purple"> 4 <div 5 class="title-style" 6 @click="openUrl(url)" 7 >{{title}}</div> 8 </div> 9 </div> 10 </template> 11 12 <script> 13 export default { 14 props: { 15 title: { 16 type: String, 17 default: 'hello world' 18 }, 19 url:{ 20 type:String, 21 default:'https://www.baidu.com' 22 } 23 }, 24 methods:{ 25 openUrl(url){ 26 window.open(url,"_blank"); 27 //_blank : 在新窗口打开 28 //_self : 在当前窗口打开 29 30 //window.location.href = url : 当前页面重定向 31 } 32 } 33 } 34 </script> 35 36 <style> 37 </style>
本文来自博客园,作者:不如饲猪,转载请注明原文链接:https://www.cnblogs.com/ifeelthecall/p/15401189.html