wepy框架的API的预加载$preload这功能阔以喔
优势:比 url 传递、或是 storage 、或是 globalData 更方便
1:如 url 不能直接传一个 Object 要传的又要序列化与反序列化操作,麻烦(普通的单个变量还是挺便捷简单实在的)
2:如 storage 也麻烦,又要set 到用的时候还要 get
3: globalData 来虽然比上面两种貌似更有优势,但是这个交互的数据挺大,整天挂载在globalData,同时挂载上后去到那个页面能访问的到(别人说可以设置null,即使这样还不是 多以key在globalData上)
但是很多的preload数据只是单一渲染后就不要,也没有必要挂载在 globalData 上,所以本人觉得 $preload 大有用处
$preload 使用
A页面preload数据
注意:先 preload 再进行页面路由跳转,编程序路由跳转啊,
不要使用给navigator组件绑定点击事件preload啊
data = {
preloadData: {
name: 'Hello',
age: '18'
}
};
methods = {
navigateToBPage() {
this.$preload('preload', preloadData) //先
wepy.navigateTo({
url: `/pages/b/b?sourcePage=${this.sourcePage}`
});
} //后
};
// 'preload' 自己命名一个想要的有意义的变量名就好
// preloadData 数据格式,根据自己需求定义
B页面接收
//必须在 onLoad 钩子函数才可以接收到
// options 为 url 的参数
// preloadData 为上个页面 preload 过来的
// 具体打印 出来 查看 preloadData 具体是什么
onLoad(options, preloadData) {
if (preloadData.preload && preloadData.preload.name) {
cosole.log('拿到A页面preload过来的数据了:', preloadData.preload);
}
};
假如是A页面的组件触发的,那preload就要变通一下,方法有可以多种的
//1: 直接定义组件的methods的方法里面
methods = {
navigateToBPage() {
this.$parent.$preload('preload', preloadData) //先
wepy.navigateTo({
url: `/pages/b/b?sourcePage=${this.sourcePage}`
});
} //后
};
//***********************************************************
//2:使用组件的通讯交互
methods = {
navigateToBPage() {
this.$emit('emit_parent_preload', preloadData);
}
};
//$emit一个事件出去,触发父页面preload
//A页面在events定义:
events = {
emit_parent_preload(preloadData) {
this.$preload('preload', preloadData);
wepy.navigateTo({
url: `/pages/b/b?sourcePage=${this.sourcePage}`
});
}
}
我个人在使用 wepy框架开发小程序,是挺喜欢用 prelaod 与路由导航的 API 这样结合方式传递数据的!
看到这里,不放你也使用,试一试......
wepy框架的API的预加载$preload这功能阔以喔的更多相关文章
- ASP.NET MVC3 Razor 调试与预加载
目录(?)[-] 获取服务器信息 FormsAuthenticationSlidingExpiration 属性 MVC3预加载 在ASP.NET MVC3开发中,调试中怎么也是不可缺少的,那对于 ...
- javascript设计模式实践之代理模式--图片预加载
图片的预加载就是在加载大图片前,先显示一个loading.gif,就算在网络比较慢的时候也能让人知道正在加载,总比啥反应都没有强. 下面这段代码就是预加载的一个简单的实现,假设先不处理加载图片时的on ...
- jquery.imgpreload.min.js插件实现页面图片预加载
页面分享地址: http://wenku.baidu.com/link?url=_-G8miwbgDmEj6miyFtjit1duJggBCJmFjR2jky_G1VftD9eS9kwGOlFWAOR ...
- 使用HTML5的页面资源预加载(Link prefetch)功能加速你的页面加载速度
不管是浏览器的开发者还是普通web应用的开发者,他们都在做一个共同的努力:让Web浏览有更快的速度感觉.有很多已知的技术都可以让你的网站速度变得更快:使用CSS sprites,使用图片优化工具,使用 ...
- 【原创】从零开始搭建Electron+Vue+Webpack项目框架(五)预加载和Electron自动更新
导航: (一)Electron跑起来(二)从零搭建Vue全家桶+webpack项目框架(三)Electron+Vue+Webpack,联合调试整个项目(四)Electron配置润色(五)预加载及自动更 ...
- AngularJS进阶(三十)AngularJS项目开发技巧之图片预加载
AngularJS项目开发技巧之图片预加载 绪 项目(移动端采用Ionic 框架)开发完毕,测试阶段发现移动APP首页的广告图片(图片由服务器端返回相应url地址)很难加载,主要原因还是网速.如下图左 ...
- mui webview 预加载
所谓的预加载技术就是在用户尚未触发页面跳转时,提前创建目标页面,这样当用户跳转时,就可以立即进行页面切换,节省创建新页面的时间,提升app使用体验.mui提供两种方式实现页面预加载. 方式一:通过mu ...
- js图片预加载
图片预加载有大体有几种方式 1.html标签或css加载图片. 显而易见我们使用img标签或者通过标签的background-image属性都可以实现图片的预加载.但是为了避免初次载入过多图片影响体验 ...
- spine实现预加载(一)
前言 本文实现了spine动画的预加载,解决在战斗等大量加载spine动画的时候出现卡顿现象. 这里使用和修改三个类,直接修改的源码,当然你也可以继承LuaSkeletonAnimation,自己封装 ...
随机推荐
- set 集合————两个数组的交集
class Solution { public: vector<int> intersection(vector<int>& nums1, vector<int& ...
- JS对以对象组成的数组去重
这是从https://segmentfault.com/q/1010000006954351参考的,达到了我要去重的功能!!! var hash = {};//arr是要去重的对象数组 arr = a ...
- DOM元素属性值如果设置为对象
结论:内部会调用toString方法,将设置的对象转换为字符串添加给相应的属性: 这个问题呢,是通过jQuery的each方法中,回调函数的this指向问题而来: 我们知道,回调函数中的this如果指 ...
- 聚类(Clustering)
简介 相对于决策树.朴素贝叶斯.SVM等有监督学习,聚类算法属于无监督学习. 有监督学习通常根据数据集的标签进行分类,而无监督学习中,数据集并没有相应的标签,算法仅根据数据集进行划分. 由于具有出色的 ...
- poj 3311 Hie with the Pie (状压dp) (Tsp问题)
这道题就是Tsp问题,稍微加了些改变 注意以下问题 (1)每个点可以经过多次,这里就可以用弗洛伊德初始化最短距离 (2)在循环中集合可以用S表示更清晰一些 (3)第一维为状态,第二维为在哪个点,不要写 ...
- C/C++ Quick Sort Algorithm
本系列文章由 @YhL_Leo 出品,转载请注明出处. 文章链接: http://blog.csdn.net/yhl_leo/article/details/50255069 快速排序算法,由C.A. ...
- HTTP Status 500 - Request processing failed; nested exception is java.lang.NullPointerException
HTTP Status 500 - Request processing failed; nested exception is java.lang.NullPointerException type ...
- 2015多校联合训练赛hdu 5301 Buildings 2015 Multi-University Training Contest 2 简单题
Buildings Time Limit: 4000/2000 MS (Java/Others) Memory Limit: 131072/131072 K (Java/Others) Tota ...
- Visual C++文件后缀名释义
[1] .APS:存放二进制资源的资源辅助中间文件(可加快资源装载速度). [2] .BMP:位图资源文件. [3] .BSC:浏览信息文件.由浏览信息维护工具(BSCMAKE)从原始浏览信息文件(. ...
- ubuntu12.04下CKermit与开发板交互环境搭建
CKermit蛮好的一个调试工具!就像在windows下的telnet,但是还是折腾了一下,现在看来,非常容易,其实我主要是在开发板为正常工作的情况下,以为是CKermit的问题,其实是我开发板开机设 ...