vue同一页面传值更新数据需要点击两次生效解决办法

源码技巧6年前 (2019-07-10)10270

详情参考vue异步更新队列:https://cn.vuejs.org/v2/guide/reactivity.html#%E5%BC%82%E6%AD%A5%E6%9B%B4%E6%96%B0%E9%98%9F%E5%88%97

通过nextTick方法可以立即更新渲染页面,实例如下

            //分类点击方法
            open_list_all: function (list_id=0,m_cid=0) {
                this.$nextTick(function () { //异步更新队列立马执行
                    vm.m_name_list(); //触发获取小分类接口
                    console.log('nextTick2');    
                    
                });
                //vm.m_name_list(); //触发获取小分类接口
                vm.list_index = list_id; //分类ID
                vm.m_index = m_cid;//小分类ID
                var HeaderHeight = $api.getStorage('Header-height');
                var FooterHeight = $api.getStorage('Footer-height');
                var TabHeight = $api.byId('headerNav').offsetHeight;
                var NewHeaderHeight = parseInt(HeaderHeight) + parseInt(TabHeight);
                //console.log(HeaderHeight);
                //console.log(FooterHeight);
                //console.log(api.winHeight);
                //console.log('TabHeight =>' + TabHeight);
                //console.log(NewHeaderHeight);
                console.log('list_index =>' + vm.list_index);
                api.openFrame({
                    name: 'all_list',
                    url: 'all_list.html',
                    rect: {
                        x: 0, //左上角x坐标
                        y: NewHeaderHeight, //左上角y坐标
                        w: 'auto', //宽度,若传'auto',页面从x位置开始自动充满父页面宽度
                        h: api.winHeight - NewHeaderHeight - FooterHeight, //高度,若传'auto',页面从y位置开始自动充满父页面高度
                    },
                    bounces: false, //页面是否弹动
                    reload: true,
                    pageParam:{
                        list_id: list_id,
                        m_cid: m_cid,
                    }
                });
            },

“vue同一页面传值更新数据需要点击两次生效解决办法” 的相关文章

发表评论

访客

看不清,换一张

◎欢迎参与讨论,请在这里发表您的看法和观点。