美文网首页
vue组件刷新

vue组件刷新

作者: 祭孑 | 来源:发表于2019-11-13 15:20 被阅读0次

    1.app.vue

    <template>
      <div id="app">
        <!--<img src="./assets/logo.png">-->
        <router-view v-if="isRouteAlive"/>
      </div>
    </template>
    
    <script>
    export default {
      name: 'App',
      provide () {
        return {
          reload: this.relord
        }
      },
      data () {
        return {
          isRouteAlive: true
        }
      },
      methods: {
        reload () {
          this.isRouteAlive = false
          this.$nextTick (() => {
            this.isRouteAlive = true
          })
        }
      }
    }
    </script>
    

    2.需要刷新的组件

    <template>
      <div class="hello">
        <el-button @click="refresh">刷新</el-button>
      </div>
    </template>
    
    <script>
    export default {
      name: 'HelloWorld',
      inject: ['reload'],
      created () {
        console.log('created-测试')
      },
      mounted () {
        console.log("mounted-测试")
      },
      methods: {
        refresh () {
          this.reload()
        }
      }
    }
    </script>
    

    相关文章

      网友评论

          本文标题:vue组件刷新

          本文链接:https://www.haomeiwen.com/subject/rrohictx.html