Kendo单页面应用(Single-Page Application,缩写为SPA)定义了一组类用于简化Web应用(Rich Client)开发,最常见的单页面应用为Gmail应用,使用单页面可以给用户有使用桌面应用的用户体验。
Kendo 的Route类负责跟踪应用的当前状态和支持在应用的不同状态之间切换。Route通过Url的片段功能(#url)和流量器的浏览历史功能融合在一起。从而可以支持把应用的某个状态作为书签添加到浏览器中。Route也支持通过代码在应用的不同状态之间切换。
View和Layout类用于UI的显示。 UI事件和数据绑定可以通过MVVM或data初始化属性来完成。
下面为一个最简单的SPA应用框架。

1 <div id="app"></div>
2  
3 <script id="index" type="text/x-kendo-template">
4     Hello <span data-bind="text: foo"></span>
5 </script>
6  
7 <script>
8     var index = new kendo.View(
9         "index", // the id of the script element that contains the view markup
10         { model: kendo.observable({ foo: "World!" }) }
11     );
12  
13     var router = new kendo.Router();
14  
15     router.route("/", function() {
16         index.render("#app");
17     });
18  
19     $(function() {
20         router.start();
21     });
22 </script>

运行这个应用,显示“Hello,World”。

 

Kendo UI开发教程(23): 单页面应用(一)概述的更多相关文章

  1. Kendo UI开发教程(24): 单页面应用(二) Router 类

    Route类负责跟踪应用的当前状态和支持在应用的不同状态之间切换.Route通过Url的片段功能(#url)和流量器的浏览历史功能融合在一起.从而可以支持把应用的某个状态作为书签添加到浏览器中.Rou ...

  2. Kendo UI开发教程(26): 单页面应用(四) Layout

    Layout继承自View,可以用来包含其它的View或是Layout.下面例子使用Layout来显示一个View 1 <div id="app"></div&g ...

  3. Kendo UI开发教程(25): 单页面应用(三) View

    View为屏幕上某个可视部分,可以处理用户事件. View可以通过HTML创建或是通过script元素.缺省情况下View将其所包含的内容封装在一个Div元素中.Kendo创建View有两种方式: 使 ...

  4. [置顶] Kendo UI开发教程: Kendo UI 示例及总结

    前面基本介绍完Kendo UI开发的基本概念和开发步骤,Kendo UI的示例网站为http://demos.kendoui.com/ ,包含了三个部分 Web DemoMobile DemoData ...

  5. Kendo UI开发教程(16): Kendo MVVM 数据绑定(五) Events

    本篇和Kendo UI开发教程(14): Kendo MVVM 数据绑定(三) Click类似,为事件绑定的一般形式.Events绑定支持将ViewModel的方法绑定到DOM元素的事件处理(如鼠标事 ...

  6. Kendo UI开发教程(9): Kendo UI Validator 概述

    Kendo UI Validator 支持了客户端校验的便捷方法,它基于HTML 5 的表单校验功能,支持很多内置的校验规则,同时也提供了自定义规则的便捷方法. 完整的Kendo UI 的Valida ...

  7. 关于Kendo UI 开发教程

    Kendo UI 开发教程 jQuery UI 是一套 JavaScript 函式库,提供抽象化.可自订主题的 GUI 控制项与动画效果.基于 jQuery JavaScript 函式库,可用来建构互 ...

  8. Kendo UI开发教程(27): 移动应用开发简介

    Kendo UI 支持开发Web应用,前面介绍的SPA,也支持开发移动应用,至于使用 HTML5 + JavaScript + CSS开发移动是不是一个好的选择不在本文的讨论之中.Kendo UI M ...

  9. Kendo UI开发教程(6): Kendo DataSource 概述

    Kendo 的数据源支持本地数据源(JavaScript 对象数组),或者远程数据源(XML, JSON, JSONP),支持CRUD操作(创建,读取,更新和删除操作),并支持排序,分页,过滤,分组和 ...

随机推荐

  1. BZOJ 2809: [Apio2012]dispatching( 平衡树 + 启发式合并 )

    枚举树上的每个结点做管理者, 贪心地取其子树中薪水较低的, 算出这个结点为管理者的满意度, 更新答案. 用平衡树+启发式合并, 时间复杂度为O(N log²N) ------------------- ...

  2. Asp.Net Core

    开源Asp.Net Core小型社区系统 源码地址:Github 前言 盼星星盼月亮,Asp.Net Core终于发布啦!! Asp.Net发布时我还在上初中,没有赶上.但是Asp.Net Core我 ...

  3. 引用 xp系统引导修复(转载)

    引用 3592wangxiaoxi 的 xp系统引导修复(转载) 原文来自百度知道a12424106关于“急需xp系统引导方面的知识!”的回复. XP系统的引导过程 如果想学习排除计算机系统故障,首先 ...

  4. PHP 重载 __call() _callStatic方法

    在C++和java中,可以函数参数的个数或类型来进行重载.但php是弱类型的语言,无法采用传统的方法.若下面这样: class Person{ function fun1($a) { echo 'fu ...

  5. Chapter 17 Replication 复制

    Chapter 17 Replication 复制 Table of Contents 17.1 Replication Configuration 17.2 Replication Implemen ...

  6. linux c 得到时间

    ctime: 将时间和日期以字符串格式表示头文件: time.h函数定义: char *ctime(const time_t *timep); 应用举例:#include <stdio.h> ...

  7. 基于visual Studio2013解决C语言竞赛题之0603打印素数

     题目

  8. nginx sendfile tcp_nopush tcp_nodelay参数解释

    sendfile 现在流行的web 服务器里面都提供 sendfile 选项用来提高服务器性能,那到底 sendfile是什么,怎么影响性能的呢?sendfile实际上是 Linux2.0+以后的推出 ...

  9. Python标准库:内置函数repr(object)

    本函数是返回对象object的具体说明字符串. 样例: #repr() print(repr(range(5))) print(repr(help)) print(repr(0x200)) print ...

  10. android蓝牙的调试(博通蓝牙工作 and 低功耗模式)

    首先结合项目从整体上去把握这部分: 蓝牙模块中一个比较核心的文件是bluetooth.c, 在我们上电的时候, 会调用这个文件中bt_enable()这个函数, 在这个函数里面先调用set_bluet ...