首页 > 其他分享 >Knockout.js初探

Knockout.js初探

时间:2023-08-16 16:35:47浏览次数:34  
标签:MVP MVVM Knockout 代码 ko js 初探


Knockout是一个轻量级的js的UI类库,通过应用MVVM模式

(Model-View-ViewModel,MVP是用在某个特定页面上,WPF技术出现,使得MVP晋级成MVVM。

模式也是依次进化而形成MVC—>MVP—>MVVM。WPF就是Windows Vista的用户界面框架,

属于NET Framework 3.0的一部分。)

使JavaScript前端UI简单化。

Knockout使用js代码达到双向绑定的目的,主要就是利用相关的特性进行开发的,极大地减少了代码开发量。

它的发明者来自微软,但ko是开源的(正如boostmap的发明者来自twitter,但bootstrap不是twitter的)

基本的理念是: 数据修改后,界面会自动更新。在html的控件中使用databind属性,

用ko.applybindings(函数())来激活,并用ko.observable来传递数据。

这样就能达到数据的关联联动了。如果当需要同步的数据点很多的时候,ko的优势就会大大体现了。

不用多写代码,自动关联。据统计ko的代码量是同比的jquery的五分之一。

 

使用起来也很方便,只需要把Knockout.js  include 到页面中就可以了


比如像进度条这样的,也是可以使用Knockout做文件上传和实际进度显示的关联的。





标签:MVP,MVVM,Knockout,代码,ko,js,初探
From: https://blog.51cto.com/u_7457870/7110108

相关文章

  • JS实现大文件上传
    ​ 这里只写后端的代码,基本的思想就是,前端将文件分片,然后每次访问上传接口的时候,向后端传入参数:当前为第几块文件,和分片总数下面直接贴代码吧,一些难懂的我大部分都加上注释了:上传文件实体类:看得出来,实体类中已经有很多我们需要的功能了,还有实用的属性。如MD5秒传的信息。pub......
  • python中自定义类对象json字符串化的方法
    1.用json或者simplejson就可以2.定义转换函数:defconvert_to_builtin_type(obj):print'default(',repr(obj),')'#把MyObj对象转换成dict类型的对象d={}d.update(obj.__dict__)returnd 3.定义类classObject():name=""size=0def__init__(......
  • json 对象格式
    {"allIds":[98,100,105,106,107,101,108,109,110,102,111,112,128,103,113,114,115,116,117,118,119,120,121,122],"ids":[98,100,105,106,107,101,108,109,110,102,111,112,128,103,113,114,115,116,117,118,119,120,121,122],"objTypeList":[......
  • JavaScript – Alpine.js
    前言Alpine是高山的意思。Alpine.js是一个轻量级的JSFramework。我为什么会去用它呢?是这样的,我在做企业网站开发的时候会有2个阶段。第一个draft阶段,只写HTML、CSS、JS。不会涉及ASP.NETCore、SQLServer。第二个阶段就是final,会引入ASP.NETCore、SQLServer......
  • MySQL8.0 JSON的对比、排序和索引
    (目录)JSON的对比和排序JSON值可以通过=,<,<=,>,>=,<>,!=,<=>操作符来进行对比JSON不支持BETWEEN,IN(),GREATEST(),LEAST(),可以通过将JSON转换为其他数据类型来使用这些操作符。JSON值的对比在两个级别上进行,先进行数据类型的对比,如果类型相同,再进行值的对比。类型可以......
  • js网络请求
    varxhr=newXMLHttpRequest();xhr.withCredentials=false;xhr.open('post','http://localhost:20100/API/Wms/GetDeliveryDate',true);//请求超时的时间(单位:毫秒)xhr.timeout=3000;//xhr.open('post','http://supply.zhglory.com.cn:90......
  • C#实现用正则表达式替换JSON中大字段的内容
    ///<summary>///过长的数据在日志中不显示///</summary>///<paramname="orilog">原请求</param>///<paramname="ignore">需要过滤的参数</param>privatestringRemoveIgnor......
  • C# Json 序列化 反序列化
    ///<summary>///Json编码器///</summary>///<typeparamname="T"></typeparam>publicclassJsonEncode{///<summary>///反序列化///</summary>///<paramname="data"></param&g......
  • JS逆向日记 2
    0x1.源代码!function(){'usestrict';varc=q;functionx(){vary=['ver','1fa','.+)','rch','ist','.80','wXB','sio','app','ass','fb6','yQJ......
  • 什么是 Node.js 的 cross-env 工具包
    cross-env是一个运行在Node.js环境中的工具包,它的主要作用是让我们可以在命令行中设置环境变量,而不必担心跨操作系统的兼容问题。在Unix和Windows系统中设置环境变量的方式是不同的,这就导致了我们无法写出一条在所有操作系统中都可以运行的设置环境变量的命令。cross-env......