Vue Reload or Refresh Page
.jpg)
In this tutorial, we will learn how to reload or refresh a webpage onclick button. We provide two examples in this post. In the first example, we use the Options API, and in the second example, we use the Compositions API. We utilize the window.location.reload()
function to reload or refresh the page.

written

reviewed

updated

Thanks for your feedback!
Your contributions will help us to improve service.
How to Reload Page in Vuejs?
Here is an example provided to refresh or reload the page onclick of a button. Feel free to try it out and modify the code as per your preference for use in your project.
Vue Js Reload/Refresh Page on Click(Options Api) Example
Copied to Clipboard
xxxxxxxxxx
<div id="app">
<div>
<button @click="reloadPage">Reload Page</button>
</div>
</div>
<script>
new Vue({
el: '#app',
methods: {
reloadPage() {
window.location.reload();
}
}
});
</script>
Output of Vue Js Refresh Page on Button Click
Vue 3 Reload Page(Composition API) Example
Copied to Clipboard
xxxxxxxxxx
<script type="module">
const {createApp} = Vue;
createApp({
setup() {
const refreshPage = () => {
window.location.reload();
};
return {
refreshPage
};
}
}).mount("#app");
</script>
Ad