このプロジェクトは、現在のページのニーズをリフレッシュする必要があり
、一般的な方法のこれらのタイプは、現在のページを更新しています
1、history.go(0)
2、location.reload()
3、位置=位置
4、location.assign(位置)
5、document.execCommand( 'リフレッシュ')
6、window.navigate(位置)
7、場所。置き換え(位置)
8、document.URL = LOCATION.HREF
しかし、これらのタイプは、ユーザーエクスペリエンスが悪い、白い画面が表示されます
**
推奨ソリューション:
**
組み合わせが提供/注入
理論的根拠:、すべての将来の世代の注入に祖先に依存する成分を可能にしますどんなに深いコンポーネント・レベル、および時間の設立以来、上流と下流の関係で、常に有効になります
ページが再びロードされている制御するようにApp.vue、文のリロード方法では、ルータ・ビューの表示を制御したり非表示にします。
<template>
<div id="app">
<router-view v-if="isRouterAlive"></router-view>
</div>
</template>
<script>
export default {
name: 'App',
provide () {
return {
reload: this.reload
}
},
data () {
return {
isRouterAlive: true
}
},
methods: {
reload () {
this.isRouterAlive = false
this.$nextTick(function () {
this.isRouterAlive = true
})
}
}
}
</script>
ページを更新するために使用する必要があります。リロードにページ(...削除または追加)注射App.vue成分(提供)を提供し、そしてロジックの完了後に依存し、直接this.reload()の呼び出しは、現在のページを更新することができます。
リロード注入法
inject::['reload']
export default {
name:"header",
inject::['reload'], //重点!!!!
data(){
return{
}
}
}
コール:
this.reload()
この時点ことに注意してください