一 前言

wex5作为开发利器,框架本身的集成能力与拓展能力可谓简单强大。在学习过程中,对框架的拓展能力,需要通过实践来丰富。今天,我以实际工作中的实例,先来看一看,框架上的公共data组件的实现与用法。

有朋友问了,每个页面都有data,为什么要做一个公共data组件呢?

我的设计原因是:

1. 比如商城页面里,首页,商品页,微淘页,等多个页面,同时用到了同一个商品data,并且通过list来装载商品列表。如果每个页面都加载data,数据库资源显然要访问三次,

页面响应显然会是重复加载,速度变慢。

2 在设计过程中,会不断修改共用data的字段,一旦数据库字段修改,前端data组件不能及时同步更新,需要手动重新链接表。这样,会显得操作很繁琐。

3. 充分发挥框架的拓展能力,简化设计思路,便于维护。

二 效果演示:

三 代码实现

1 框架首页,创建公共data, 这里主要讲商品goodsdata

2 首页加载完成后创建全局变量,并引用为goodsdata

3 list绑定公共data

(注意) list 绑定data ,必须是全局变量的变量名,这里是goodsData,goddsData.datas表示公共data里的数据。

4 list中的行绑定方法

5 调用公共data

(注)不是想像中的window.xxxxx,而是直接取全局变量名,虽然提示未定义,经测试,可以直接使用。基于wex5的框架能力,全局data虽然未在页面中定义,但是做为全局变量可以在其它页面中直接调用变量名。

四 总结

1 全局data利于简化开发思路

2 全局变量易于调式修改

3 基于全局data更利于简化项目多页面的调度

wex5 实战 框架拓展之1 公共data组件(Data)的更多相关文章

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

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

  2. wex5 实战 用户点评与提交设计技巧

    最近遇到很多同学做毕业设计,其中有一项是用户点评与提交.功能并不复杂,同学们又不会,做为一个完整的功能,如果用wex5来设计开发,事半功倍.今天就以景区实战来向大家展示wex5的高效与强大.半天可以设 ...

  3. 实战框架ABP

    abp及实战框架概述 接触abp也快一年了,有过大半年的abp项目开发经验,目前项目中所用的abp框架版本为0.10.3,最新的abp框架已经到了1.4,并且支持了asp.net core.关于abp ...

  4. java(样品集成框架spring、spring mvc、spring data jpa、hibernate)

    这是你自己的参考springside集成框架的开源项目.主要的整合spring.spring mvc.spring data jpa.hibernate几个框架,对于这些框架中仍然感觉更舒适sprin ...

  5. Thinkphp框架拓展包使用方式详细介绍--验证码实例(十一)

    原文:Thinkphp框架拓展包使用方式详细介绍--验证码实例(十一) 拓展压缩包的使用方式详细介绍 1:将拓展包解压:ThinkPHP3.1.2_Extend.zip   --> 将其下的 \ ...

  6. Web自动化必会知识:「Web基础、元素定位、元素操作、Selenium运行原理、项目实战+框架」

    1.web 基础-html.dom 对象.js 基本语法 Dom 对象里面涉及元素定位以及对元素的修改.因为对元素操作当中涉及的一些 js 操作,js 基本语法要会用.得要掌握前端的基本用法.为什么要 ...

  7. 关于动态生成data组件

    /*! * WeX5 v3 (http://www.justep.com) * Copyright 2015 Justep, Inc. * Licensed under Apache License, ...

  8. rest-framework框架——认证、权限、频率组件

    一.rest-framework登录验证 1.models.py添加User和Token模型 class User(models.Model): name = models.CharField(max ...

  9. $.data()、$().data

    两个方法很相似,但是有区别,简单说一下: $.data():jq的静态方法,也就是jQuery.data()直接调用 $().data():实例方法,先有实例,才能调用这个方法,例如:$(" ...

随机推荐

  1. win7+vs2008+windows mobile6.5.3

    1.安装vs2008+vs2008sp12.安装Windows Mobile 6 Professional SDK Refresh.msi3.安装Windows Mobile 6 Profession ...

  2. Qt之创建桌面和开始菜单快捷方式

    将安装好的酷狗拷贝到C:\data目录中 1.创建桌面快捷方式 QFile::link("C:/data/KuGou.exe", QStandardPaths::writableL ...

  3. .NET中MemCached使用介绍

    阅读目录 1.MemCached是什么? 2.Window中MemCached安装 3.MemCached命令 4.简单示例 MemCached是什么 MemCached是一个自由开源,高性能,分布式 ...

  4. CSS3 媒体查询移动设备尺寸 Media Queries for Standard Devices (包括 苹果手表 apple watch)

    /* ----------- iPhone 4 and 4S ----------- */ /* Portrait and Landscape */ @media only screen and (m ...

  5. Unix内核中打开文件的表示

    Unix内核中已经打开文件,通过三种数据结构表示: 每个进程的进程表中的记录项,包含打开的文件的文件描述符表,与之关联的是: 文件描述符标识 指向一个文件表项的指针 内核为所有打开文件维持一张文件表, ...

  6. Wrestling Match---hdu5971(2016CCPC大连 染色法判断是否是二分图)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5971 题意:有n个人,编号为1-n, 已知X个人是good,Y个人是bad,m场比赛,每场比赛都有一个 ...

  7. WCF Binding

    <Programming WCF Services>有一幅图也能说明各自的特征: 下面的图给出了我们选择Binding的方式

  8. a 添加href后当前栏目如何高亮显示

    //nav $(".nav li a").each(function() { $this = $(this); if ($this[0].href == String(window ...

  9. Python模拟实现Linux系统unix2dos功能

    目标 1.Linux系统与windows系统文件系统换行符问题 2.实现unix文件转换成dos文件格式 1.Linux系统与windows系统文件系统换行符 •关于回车|换行的来历 在计算机还没有出 ...

  10. ios-将代码创建的视图控件放入拖拽控件的下面

    如图所示 图片是拖拽上去的imageView,橘黄色控件是在代码中创建的添加上去的,此时黄色view在imageView 上方 调用方法bringSubviewToFront:试图将imageView ...