在wex5官方教程中,关于多页模式与单页模式进行了对比。两者最大的区别在于:

1 web加载速度,单页模式快于多页模式

2  多页模式对加载机制进行了预加载,一次加载之后再次加载,就会加快。

但是,由于项目需要,多页模式无法满足我对全局变量的绑定属性的获取(大家看我全局可观察变量博文),所以对页面进行了全部重构,重构之后,web加载的响应速度大大提高,没有了明显的卡顿感。但是,也带来了更严重的问题,页面数据不同步。

起先以为是坑,其实是对页面的加载机制不了解。

先看一下不同步的情况:

新增一条发货单

返加首页,问题来了,货单没有刷新,没有新增

这就是我们今天要着手解决的问题。首先告诉大家,解决之道很简单,简单到想都想不到。关键是,我们今天以解决方法和思维模式为重点。

二   解决思路:

1,先判断data有没有新增。

方法简单,先放到modeLoad里,发现,只能加载一次!!!加载后再从别的页面回来,也不行。

也就是说,别的页面新增或删除修改再跳转回来,modeLoad里的方法只执行一次。

手动加一个按钮,看下,data有没有新增,再来试一下:

悲剧发生了,手动刷新,居然也不能刷新data,条数还是5条!!!!

在单页模式里,小项目也有几十个页面,页面单换来换去,如果有数据操作,其它页面不能响应,数据不同步, 这个项目,估计没法再往下进行了。

但是,我发现,每次web重启动后,data就自动刷新到了最新状态。难道是页面刷新问题?

2  页面刷新

首先想到了window.location.reload().

一试,泪崩,整个web重新启动了。不行。

3. div刷新

群里很多朋友问div刷新的问 题,估计也是想强制刷新页面内容。

不行。

4.windownDialog刷新

本来用的单页模式,再装回到多页模式,多此一举。

一次次的测试,死的心都有了。明明data数据更新了,非要刷什么页面呢?

data更新?

data更新?

再回到原点想问题,想想,还有哪里能时实接收数据????

想想

想想

想到了页面传参与收参paramsReceive

对,就是这个。

三  页面同步方法

1 在页面半闭时,传参,用于触发目标页面的参数接收动作

2  目标页面,接参,并刷新data

再来测试,data和list同步进行了响应和更新。

之前用了很长时间来刷页面,刷list,刷div,刷窗口,再如此处理,好像白学了。没想到解决方法这么简单。关键是打到问题的根源和实质,需要时间和大量测试。

四 总结:

1  学会分步测试

2 modelParamsRecive具有实时性,无论什么时候跳转至页面,它都在modeload之前进行,只要有参传进来,就能触发。充分利用这一点,可以让data数据实时刷新。

wex5 实战 单页模式下的多页面数据同步的更多相关文章

  1. wex5 实战 省市县三级联动与地址薄同步

    无论是商城,还是快递,都要用到省市县三级联动,和地址薄,今天就以实战来制作,难点有3个: 1:三级联动,有wex5组件实现,相对简单,实战里对行数据进行了拼接 2:  地址薄选项,利用inputSel ...

  2. CentOS7下rsync服务端与Windows下cwRsync客户端实现数据同步配置方法

    最近需求想定期备份服务器d盘的数据到Linux服务器上面,做个笔记顺便写下遇到的问题 以前整过一个win下的cwrsync(客户端)+rsync(服务端:存储)的bat脚本 和整过一个Linux下的r ...

  3. ASP.NET Core 一步步搭建个人网站(6)_单页模式和优化

    前言 HI,有段时间没有更新了,主要因为第一年前事情比较多,有些事得忙着张罗下:第二呢,对个人网站进行了一次大范围的优化,主要是申请的云服务器资源有限,1m的网络带宽,带上图片展示的话,打开网站的平均 ...

  4. wex5 实战 框架拓展之2 事件派发与data刷新

    一 前言 讲完公共data,相信大家对框架级的data组件级绑定有了更新的认识,接下来我们继续深入,以求研究明白wex5的框架能力. 在一个web项目中,其实有一个data, 是基础框架必须的data ...

  5. Python接口测试实战1(下)- 接口测试工具的使用

    如有任何学习问题,可以添加作者微信:lockingfree 课程目录 Python接口测试实战1(上)- 接口测试理论 Python接口测试实战1(下)- 接口测试工具的使用 Python接口测试实战 ...

  6. SNF开发平台WinForm之一-开发-单表表格编辑管理页面-SNF快速开发平台3.3-Spring.Net.Framework

    1.1运行效果: 1.2开发实现: 1.2.1          首先在数据库中创建需要开发的数据表,在代码生成器中进行配置连接数据库. 代码生成器的Config.xml文件配置如下节点: 1.2.2 ...

  7. 【转】移动Web单页应用开发实践——页面结构化

    1. 前言 在开发面向现代智能手机的移动Web应用的时候,无法避免一个事实,就是需要开发单页应用(Single Page WebApp).对于不同的系统需求,单页应用的粒度会不同,可能是整个系统都使用 ...

  8. 移动Web单页应用开发实践——页面结构化

    1. 前言 在开发面向现代智能手机的移动Web应用的时候,无法避免一个事实,就是需要开发单页应用(Single Page WebApp).对于不同的系统需求,单页应用的粒度会不同,可能是整个系统都使用 ...

  9. 微信小程序教学第三章第四节(含视频):小程序中级实战教程:下拉更新、分享、阅读标识

    下拉更新.分享.阅读标识 本文配套视频地址: https://v.qq.com/x/page/h0554i4u5ob.html 开始前请把 ch3-4 分支中的 code/ 目录导入微信开发工具 这一 ...

随机推荐

  1. 读取bmp图片数据

    public void getBMPImage(String source) throws Exception { clearNData(); //清除数据保存区 FileInputStream fs ...

  2. yxcms后台验证码不显示?怎么取消yxcms后台验证码

    嗨,大家好,我是YXCMS的小M老湿,(其实还是习惯大家叫我猪猪吧!)今天又要分享一则yxcms的使用技巧,当然也是yxcms用户在使用过程中很容易出现的小白问题,当然还是同样,yxcms的大神级别的 ...

  3. App Extension

    一.扩展概述 扩展(Extension)是iOS 8中引入的一个非常重要的新特性.扩展让app之间的数据交互成为可能.用户可以在app中使用其他应用提供的功能,而无需离开当前的应用. 在iOS 8系统 ...

  4. Selenium2学习-040-JavaScript弹出框(alert、confirm、prompt)操作演示实例

    弹出框是网页自动化测试常见得操作页面元素之一,常见的JavaScript弹出框有如下三种: 1.alert(message):方法用于显示带有一条指定消息和一个 OK 按钮的警告框.DemoAlert ...

  5. zabbix agent安装与配置篇

     Zabbix监控windows部署安装 Zabbix agent 在windows上安装部署 (1)手工安装zabbix agent客户端 1.  下载与解压 地址: http://www.zabb ...

  6. cmd导入导出

    2:用cmd进入命令行输入:tnsping cmstar就是测试172.18.13.200是否连接成功3:导入与导出,如下: 数据导出: 1 将数据库TEST完全导出,用户名system 密码mana ...

  7. VS2015 + Cordova Html5开发使用Crosswalk Web引擎

    CrossWalk引擎的好处是统一不同android设备的Html5的差异性,据说速度很快. Vs2015中使用非常简单,作为一个Apache Cordova的插件安装即可: Installing t ...

  8. 测试内容url

    nscurl --ats-diagnostics https://xxxx/xxxx/main/ curl "https://app.api.gupiaoxianji.com/v3.8/ma ...

  9. 在github分支上上传空文件夹

    GIT工具是依靠文件来识别文件夹的,对于空的文件夹是不能识别的.因此如果需要在代码中增加一个空文件夹,同时需要在文件夹中增加一个空文件.gitkeep 当批量增加空文件夹时,可以在GIT库的根目录下输 ...

  10. 把 MWeb Lite 的文档库文档和数据搬到 MWeb 正式版中

    MWeb Lite 版的文档库中的文档要搬到 MWeb 正式版中,如果 Lite 版的文档中没有图片或者只有少量图片,可以用导入导出为 Markdown 的方法. 否则的话请用以下方式(注意下面这个方 ...