zoukankan      html  css  js  c++  java
  • vue 路由参数变化,页面不更新的问题

    监控$route

    在vue项目中,假使我们在同一个路由下,只是改变路由后面的参数值,如果不监听路由参数值的变化,页面无数据刷新,需手动刷新浏览器,这样做就不是我们的预期效果。

    举例:当前路由为  /pjthome?pjtid=123456

    mounted: function () {
    this.pjtid = this.$route.query.pjtid
    this.pjtdetail()
    },
    在页面pjtdetail()方法中,需要用到pjtid这个参数,假如在同一页面有相似项目切换,只是pjtid发生变化,在切换时,并未重新加载数据,原因是跟vue的生命周期有关,具体该解决这个问题,添加路由监听即可。

    exp:

    watch: {
    $route(){
    this.pjtid = this.$route.query.pjtid
    },
    pjtid() {
    this.pjtdetail()
    },
    }
    解决。
    ---------------------
    作者:酷酷小七
    来源:CSDN
    原文:https://blog.csdn.net/weixin_37861326/article/details/80525720
    版权声明:本文为博主原创文章,转载请附上博文链接!

    如:

    <script>
        export default {
            data() {
                return {
                    isApp: true,
                }
            },
            mounted() {
                this.caseId = this.$route.query.caseId;
                this.isApp = (this.$route.query.type == 'APP定制') ? true : false;
            },
            methods: {
                getIsApp() {
                    this.isApp = (this.$route.query.type == 'APP定制') ? true : false;
                }
            },
            watch: {
                $route(){
                    this.isApp = this.$route.query.type;
                },
                isApp() {
                    this.getIsApp();
                },
            }
        }
    </script>
  • 相关阅读:
    随笔——关于读论文
    enumerate
    torch.max
    C# WPF侧边栏导航菜单(Dropdown Menu)
    C# WPF过渡效果实现(C# WPF Material Design UI: Transitions)
    用C# WPF简单实现仪表控件
    自定义滚动条(Custom ScrollBar)
    从头实现一个WPF条形图
    漂亮的无序列表样式
    C# WPF实用的注册窗体
  • 原文地址:https://www.cnblogs.com/duanzhenzhen/p/10604675.html
Copyright © 2011-2022 走看看