Kendo 单页面应用(一)概述

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

<div id="app"></div>

<script id="index" type="text/x-kendo-template">
Hello <span data-bind="text: foo"></span>
</script> <script>
var index = new kendo.View(
"index", // the id of the script element that contains the view markup
{ model: kendo.observable({ foo: "World!" }) }
); var router = new kendo.Router(); router.route("/", function() {
index.render("#app");
}); $(function() {
router.start();
});
</script>

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

Kendo 单页面应用(一)概述的更多相关文章

  1. Kendo UI开发教程(23): 单页面应用(一)概述

    Kendo单页面应用(Single-Page Application,缩写为SPA)定义了一组类用于简化Web应用(Rich Client)开发,最常见的单页面应用为Gmail应用,使用单页面可以给用 ...

  2. Kendo UI 单页面应用(四) Layout

    Kendo UI 单页面应用(四) Layout Layout 继承自 View,可以用来包含其它的 View 或是 Layout.下面例子使用 Layout 来显示一个 View <div i ...

  3. Kendo UI 单页面应用(三) View

    Kendo UI 单页面应用(三) View view 为屏幕上某个可视部分,可以处理用户事件. View 可以通过 HTML 创建或是通过 script 元素.缺省情况下 View 将其所包含的内容 ...

  4. Kendo UI 单页面应用(二) Router 类

    Kendo UI 单页面应用(二) Router 类 Route 类负责跟踪应用的当前状态和支持在应用的不同状态之间切换.Route 通过 Url 的片段功能(#url)和流量器的浏览历史功能融合在一 ...

  5. fsLayuiPlugin单页面操作

    概述 单页面处理新增.修改.查看详情 共用同一个弹出的页面.在线demo数据表格2 使用 提供2种处理方式(主要区别区弹出窗口的html配置),根据实际情况选择使用那种方式. 新增.修改功能共用一个按 ...

  6. H5单页面手势滑屏切换原理

    H5单页面手势滑屏切换是采用HTML5 触摸事件(Touch) 和 CSS3动画(Transform,Transition)来实现的,效果图如下所示,本文简单说一下其实现原理和主要思路. 1.实现原理 ...

  7. 快速构建H5单页面切换骨架

    在Web App和Hybrid App横行的时代,为了拥有更好的用户体验,单页面应用顺势而生,单页面应用简称`SPA`,即Single Page Application,就是只有一个HTML页面的应用 ...

  8. webpack+react+antd 单页面应用实例

    React框架已经火了好长一段时间了,再不学就out了! 对React还没有了解的同学可以看看我之前的一篇文章,可以快速简单的认识一下React.React入门最好的实例-TodoList 自己从开始 ...

  9. AngularJS中的route可以控制页面元素的改变,使多页面变成一个单页面。。。

    SPA(Single Page Application)指的是通单一页面展示所有功能,通过Ajax动态获取数据然后进行实时渲染,结合CSS3动画模仿原生App交互,然后再进行打包(使用工具把Web应用 ...

随机推荐

  1. 洛谷P1474货币系统——背包方案计数

    题目:https://www.luogu.org/problemnew/show/P1474 完全背包,注意方案计数的方法. 代码如下: #include<iostream> #inclu ...

  2. NSCLIENT++可以采集的指标

    Documentation   Information   Commands/Modules   CheckDisk   CheckFileSize   CheckDriveSize   CheckF ...

  3. Lagom学习 (三)

    lagom代码中有大量的Lambda表达式,首先补习一下lambda表达式和函数式接口的相关知识. 一: 函数式接口: 函数式接口其实本质上还是一个接口,但是它是一种特殊的接口: 这种类型的接口,使得 ...

  4. Ternary Calculation

    Ternary Calculation Time Limit : /2000ms (Java/Other) Memory Limit : /65536K (Java/Other) Total Subm ...

  5. 转载:数据库应用开发工具Toad使用笔记

    由于网上TOAD中文教程很少,在网上摘抄了此文章便于学习,感谢原创者. TOAD使用笔记 1.把鼠标停在sql所在行,然后ctrl+Enter直接执行当前sql. 2.解决Toad对中文显示乱码问题( ...

  6. IOS推流 搭建环境

    效果图 iTools有点卡, 但是推到服务器倒是很快的. 推流 前言 这篇blog是iOS视频直播初窥:<喵播APP>的一个补充. 因为之前传到github上的项目中没有集成视频的推流.有 ...

  7. js中关于事件捕获与事件冒泡的小实验

    1.事件冒泡:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发. IE 5.5: div -> body -> document IE 6.0: div - ...

  8. HighChar

    chart: { type:'bar', borderWidth:2, borderColor: '#CA5100', backgroundColor: '#90ED7D', shadow: { // ...

  9. 3DMAX 多维材质及对应的UVW展开,UVW贴图

    多维材质说明 多维材质就是一个模型多个材质,(混合材质是多个材质混一起,跟这个貌似没关,比如地表草地,泥土等的混合操作) 作用: 比如一个模型就是需要两种材质,刀的金属刀身,木质刀柄,墙的一面是木板, ...

  10. Spark HA 配置中spark.deploy.zookeeper.url 的意思

    Spark HA的配置网上很多,最近我在看王林的Spark的视频,要付费的.那个人牛B吹得很大,本事应该是有的,但是有本事,不一定就是好老师.一开始吹中国第一,吹着吹着就变成世界第一.就算你真的是世界 ...