javascript - 在 Vue.js 中防止@click 上的 anchor 标记重新加载页面

Question

我的 vue 文件中有以下代码。我在这里面临的问题是当我点击这里时页面重新加载。我添加了 event.preventDefault() 但无法解决问题。请帮我找出我哪里出错了。

<template>
  <p>Please click <a @click="stopProcess">here</a></p>
</template>

<script>  
  export default {
    methods: {
      stopProcess(){
        event.preventDefault()
        var page = "../../../pages/page.pdf"
        window.open(page);
      }
    }
  };
</script>

Answer 1

根据您的代码，我会尝试这样做，但如果是我，我会使用路由器。

<template>
  <p>Please click <a @click="stopProcess">here</a></p>
</template>

<script>  
  export default {
    methods: {
      stopProcess(){
        var page = window.location.origin + "/pages/page.pdf"
        window.open(page);
      }
    }
  };
</script>