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>
  • 相关阅读:
    union 和 union all 区别
    sql 日期类型空值等于 1900-01-01
    IDENTITY_INSERT 自增开关使用
    Convert.ToDateTime() 与 DateTime.TryParse()区别
    SOLID 原则摘录
    不同JavaScript 代码段 变量作用域
    sql 常见错误总结
    jquery.form插件 提交表单 type="hidden"取不到值的问题记录
    同义词
    SQL优化传送门
  • 原文地址:https://www.cnblogs.com/duanzhenzhen/p/10604675.html
Copyright © 2011-2022 走看看