今天一个朋友问我setRecord 与 setData的区别

这里就不得不说到record与data的区别

console.log(record);

console.log(data);

根据官方api的解释说

record : Ext.data.Model

A model instance which updates the Component's html based on it's tpl. Similar to the data configuration, but tied to to a record to make allow dynamic updates. This must be a model instance and not a configuration of one.

谷歌后:更新组件的HTML基础上的模型实例的TPL。类似的数据结构,但是连接到一个记录,以允许动态更新。这必须是一个模型的实例,而不是一个一个配置。

data : Mixed

The initial set of data to apply to the tpl to update the content area of the Component.

谷歌后:初始数据集应用到TPL更新组件的内容区域。

record之中包括data

看api貌似是说record允许动态更新,这是神马意思呢?

实际测试一下吧

从list之中进入,执行itemtap中代码

            //招聘信息postList: {show: function () {app.app.showList('postList');},itemtap: function (list, index, target, record, e) {this.redirectTo('postInfo');app.app.showInfo(record, 'post_Info', 'PostInfo.ashx', 'telephone', {id: record.data.id});app.app.showInfo(record, 'companyInfo', 'CompanyInfo.ashx', 'c_nature', {id: record.data.company_id});Ext.getCmp('tel').setRecord(record);}}

  

以下是 app.app.showInfo

    //list->info公用加载方法showInfo: function (record, id, url, checkId, params) {if (record.data[checkId]) {Ext.getCmp(id).setRecord(record);return;}var message = Ext.getCmp('cardPanel');message.showMessage('正在努力加载中...', true);Ext.data.JsonP.request({url: app.app.postUrl + url,params: params,success: function (result, request) {record.set(result);Ext.getCmp(id).setData(record.data);message.hideMessage();},failure: function (response, opts) {message.showMessage('加载失败,请检查网络是否正常...');}});}

关键在于 Ext.getCmp(id).setData(record.data);还是Ext.getCmp(id).setRecord(record);

在这里测试过结果貌似没啥区别,不过我突然觉得也许setData()要好些,因为我只需要数据,不需要其他的东西。

结果如下:

好吧,这里还是没找出setData()和setRecord()的实质区别,不过我喜欢上了setData(),把其他地方也换成setData()吧。

意外的发现了二者的区别

                    this.redirectTo('postInfo');app.app.showInfo(record, 'post_Info', 'PostInfo.ashx', 'telephone', {id: record.data.id});app.app.showInfo(record, 'companyInfo', 'CompanyInfo.ashx', 'c_nature', {id: record.data.company_id});Ext.getCmp('tel').setRecord(record);

如代码之中,因为不想破坏我封装的showInfo()方法,所以结果图中的联系方式我是用的Ext.getCmp('tel').setRecord(record);

他的数据来源于

                    app.app.showInfo(record, 'post_Info', 'PostInfo.ashx', 'telephone', {id: record.data.id});

  

之前我就在奇怪,Ext.getCmp('tel').setRecord(record);这行代码为啥能成功获取到数据

在我换成Ext.getCmp('tel').setData(record.data);之后得出的结果就让我明白了

获取不到联系人的信息了,这才正常蛮。

因为通过jsonp获取数据是异步,所以Ext.getCmp('tel').setData(record.data);的执行是先于showInfo()中Ext.getCmp(id).setData(record.data);执行的

能取到数据才怪呢

但是为啥我用Ext.getCmp('tel').setRecord(record);能获取到呢?

在这里我就明白了,record能够在它的值改变的时候事实更新Container,不需要再次setRecord()。而data只在setData()的时候才能起到作用,每次里面的值发生改变都需要重新setData()

所以官方给出了setData()和setRecord()两种方法.大家可以根据具体情况来选择使用。感谢开发组

那么showInfo这样封装是不是比较酷一点?

    //list->info公用加载方法showInfo: function (record, id, url, checkId, params) {Ext.getCmp(id).setRecord(record);if (record.data[checkId]) {return;}var message = Ext.getCmp('cardPanel');message.showMessage('正在努力加载中...', true);Ext.data.JsonP.request({url: app.app.postUrl + url,params: params,success: function (result, request) {record.set(result);message.hideMessage();},failure: function (response, opts) {message.showMessage('加载失败,请检查网络是否正常...');}});}

  

sencha touch Container控件 setRecord 与 setData的区别相关推荐

  1. 关于 SAP UI5 Container 控件 aggregation 的深入分析试读版

    一套适合 SAP UI5 初学者循序渐进的学习教程 作者简介 Jerry Wang,2007 年从电子科技大学计算机专业硕士毕业后加入 SAP 成都研究院工作至今.Jerry 是 SAP 社区导师,S ...

  2. WINCC V7.5入门实例教程,使用常数数组用FunctionTrendControl控件绘制趋势曲线(区别于7.0及以前的老版本,脚本更新)

    近期在学习WINCC的应用,师傅在网上找了个实例让我自己试着弄一下看能不能达到效果,原文在下面,经过尝试我发现有很多脚本在7.5版本中已经更改,所以针对趋势曲线的练习,将更新后的脚本及整个效果分享出来 ...

  3. C# 控件Anchor和Dock的区别

    Anchor的英文意思是锚定.表示在窗体重置时控件与窗体(或者父控件)的相对位置保持不变.控件变化要等到窗体重置的时候才能呈现. 窗体重置前 窗体重置后 关键字:相对位置不变 Dock则是停泊的意思, ...

  4. Container 控件设置渐变色问题

    body:Center(child: Container(color: Colors.blue,width: 400,height: 200,decoration:new BoxDecoration( ...

  5. flutter控件Flexible和 Expanded的区别

    Flexible和 Expanded的区别是: Flexible是一个控制Row.Column.Flex等子组件如何布局的组件. Flexible组件可以使Row.Column.Flex等子组件在主轴 ...

  6. 学习笔记---母板页、用户控件、第三方控件及视图状态管理

    一.母版页 在制作页面的过程中, 多个页面往往具有相同的页面Header和页面Footer, 多个页面只是在中间部分有变化. 那么我们完全可以避免在每个页面中都写一遍页头和页尾的代码, 这种技术就是母 ...

  7. ActiveReports报表控件教程之单元格合并

    ActiveReports 报表控件可以通过 Matrix 实现单元格合并,无需使用代码通过设计器即可自动实现单元格合并. 实现步骤如下: 下面步骤中使用了 Reels database 中的 Emp ...

  8. java 用户控件_C#自定义控件VS用户控件

    C#中自定义控件VS用户控件大比拼 1 自定义控件与用户控件区别 WinForm中, 用户控件(User Control):继承自 UserControl,主要用于开发 Container 控件,Co ...

  9. 自定义Flutter控件

    在Flutter开发中,我们会经常和各种控件打交道,它们也能满足业务的大部分需求.但是,我们往往需要将多个控件组合起来,才能实现业务的需求,而且这样写出来的代码维护起来非常困难.因此,我们可以把那些需 ...

最新文章

  1. sql server 在占用服务器内存居高不下怎么办【转】
  2. 计算机组成测试题目及答案,计算机组成原理期中测试试卷一(含题目和答案)
  3. 一些常用的gcc指令(持续更新)
  4. c++ using 前置声明_C++ 类声明 类前置声明范例
  5. 2021“MINIEYE杯”中国大学生算法设计超级联赛(8)(1002,1004,1006,1009)
  6. css怎么把背景图片拉伸至100%
  7. 基于EasyNetQ的RabbitMQ封装类
  8. PRIMARY, INDEX, UNIQUE 这3种是一类
  9. Java 算法 友好数
  10. 并行计算(二)——通讯
  11. Scikit-learn:模型选择Model selection之pipline和交叉验证
  12. php主机卫士,Bypass360主机卫士SQL注入防御八种姿势
  13. Work Stealing
  14. 可口可乐市场调查失败的原因_经典案例可口可乐一次市场调研失败的教训
  15. 16位院士加盟!“双一流”上海大学成立人工智能研究院
  16. S型加减速程序,C++,PLC,AGV
  17. JS中的键盘事件(onkeydown、onkeyup、keyCode)
  18. 2020-11-22
  19. python学习遇到的英文词汇
  20. 【IP基本原理-ARP原理】

热门文章

  1. 服务器指定网卡进行备份数据避免影响业务口
  2. linux安装及配置c++的opencv库
  3. Android导出jar包后的资源使用问题
  4. OpenCV学习(17) 细化算法(5)
  5. 实战MEF(4):搜索范围
  6. 视频分享:挨踢项目求生法则(2)——战略篇
  7. 五种方法实现Linux批量重命名文件
  8. 变量独立与不相关的区别
  9. Win10+Anaconda创建新环境安装pytorch
  10. Exception in Tkinter callback