Vue項目保存代碼之后頁面自動更新問題
更新時間：2023年10月08日 16:47:50 作者：satuo@
這篇文章主要介紹了Vue項目保存代碼之后頁面自動更新問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
Vue項目保存代碼之后頁面自動更新
想要在代碼中保存之后，頁面自動刷新。
命令行敲如下代碼
npm install webpack-dev-server
下載了這個東西就不用每次都手動刷新了，我也不知道這個是干嘛的，留在以后研究研究！
Vue項目刷新當前頁面最優(yōu)解決
一般刷新頁面可以用location.reload(true)，history.go(0) 等方法，但是這對vue項目很不友好，會是頁面重新加載，出現(xiàn)暫時性的空白，而且耗費性能，所以vue項目最好不用這些方法.vue有this.$forceUpdate()可以強制更新，
下面介紹其他一種更好的方法。
通過v-if的功能觸發(fā)頁面刷新，結合provide和inject
<template>
<div id="app">
<router-view v-if="isShow"></router-view>
</div>
</template><script>
export default {
name: 'App',
provide () {
return {
reload: this.reload
}
},
data () {
return {
isShow: true
}
},
methods: {
reload () {
this.isShow= false
this.$nextTick(function () {
this.isShow= true
})
}
}
}
</script>在要刷新的子路由頁面引入inject,然后執(zhí)行reload事件即可刷新頁面
export default {
name: "demo",
inject:['reload'],
data() {
return {
}
},
methods: {
reflesh(){
this.reload()
},
}總結
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
vue是一款漸進式JavaScript框架,漸進式是指由淺到深,由簡單到復雜的使用vue框架,下面這篇文章主要給大家分享介紹了幾個可以助你提高效率的Vue指令,需要的朋友可以參考下2022-05-05
這篇文章主要介紹了vue實現(xiàn)登錄功能的步驟，幫助大家更好的理解和使用vue框架，感興趣的朋友可以了解下2020-12-12
Vue-Router如何動態(tài)更改當前頁url query
這篇文章主要介紹了Vue-Router如何動態(tài)更改當前頁url query問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-08-08
對于vue下的雙向綁定功能，個人理解為在處理邏輯的過程中緩存了大量的node對象，node對象可以是html標簽、文本內(nèi)容。既然選擇了緩存這些對象，那么在用的過程中哪里需要改變就把node拿出來，進行標簽屬性的變更或者文本內(nèi)容的修改。本文主要講了如何實現(xiàn)雙向綁定2021-06-06
在vue中實現(xiàn)antd的動態(tài)主題的代碼示例
在需求開發(fā)階段,鑒于項目采用了antd作為基礎組件庫,確保組件外觀與antd一致變得尤為重要,這包括顏色、字體大小及尺寸等樣式的統(tǒng)一,然而,截至當前antd-vue尚未實現(xiàn)這一便捷的CSS變量特性,但理解其背后的實現(xiàn)機制后,我們可以自行構建這一功能,需要的朋友可以參考下2024-07-07
vuejs如何清空表單數(shù)據(jù)、刪除對象中的空屬性公共方法
這篇文章主要介紹了vuejs如何清空表單數(shù)據(jù)、刪除對象中的空屬性公共方法,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2025-03-03
這篇文章主要介紹了vue項目啟動后沒有局域網(wǎng)地址問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-09-09
這篇文章主要為大家詳細介紹了Vue+Element實現(xiàn)表格單元格編輯，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-04-04
本文主要介紹vscode中 vue項目es-lint的配置方法，非常不錯，具有一定的參考借鑒價值，需要的的朋友參考下吧2018-07-07
vue中watch和computed為什么能監(jiān)聽到數(shù)據(jù)的改變以及不同之處
這篇文章主要介紹了vue中watch和computed為什么能監(jiān)聽到數(shù)據(jù)的改變以及不同之處,本文通過實例代碼給大家介紹的非常詳細，具有一定的參考借鑒價值，需要的朋友可以參考下2019-12-12