Vue prevent unload
Vue component that conditionaly prevents page leave/reload
HTML
<script src="https://rawgit.com/probil/vue-prevent-unload/master/dist/vue-prevent-unload.min.js"></script>
<script src="https://unpkg.com/vue"></script>
<div id="app">
<label> Unsaved data exist
<input type="checkbox" v-model="unsavedDataExist">
</label>
<a href="http://www.naver.com"><</a>
<prevent-unload :when="unsavedDataExist" />
</div>
CSS
/**
Try to check the checkbox and reload the page
**/
Babel + JSX
new Vue({
el: '#app',
data: () => ({
unsavedDataExist: false,
}),
components: {
PreventUnload: VuePreventUnload,
}
})