问题分析:
vue框架开发解决:
在app.vue中,先在provide中注册一个用于页面重载的方法
<template> <div class="app-wrapper"> <router-view v-if="isrouteralive" /> </div> </template> <script> export default { name: 'app', provide () { return { appreload: this.reload // 通过provider来提供变量 } }, data () { return { isrouteralive: true // 解决微信端页面刷新问题 } }, methods: { // 实现重载 reload () { this.isrouteralive = false this.$nexttick(() => { this.isrouteralive = true }) } } } </script>
然后在子组件中通过inject来注入变量,直接调用reload就可以了
<template> <div> <button @click="handlerreload">刷新</button> </div> </template> <script> export default { inject: ['appreload'], // 通过inject来注入变量 methods: { handlerreload () { this.appreload() } } } </script>
扩展知识:
provider/inject:简单的来说就是在父组件中通过provider来提供变量,然后在子组件中通过inject来注入变量。 这对选项需要一起使用,以允许一个祖先组件向其所有子孙后代注入一个依赖,不论组件层次有多深,并在起上下游关系成立的时间里始终生效。
参考资料:https://blog.csdn.net/lucky_q/article/details/89097423
如对本文有疑问, 点击进行留言回复!!
网友评论