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. boost::function 通过boost::bind调用类成员函数

    1. 首先引用boost::function和boost::bind的头文件和库: #include "boost/bind.hpp" #include "boost/f ...

  2. JSON 的正确用法:Python、MongoDB、JavaScript与AjaxJSON 的正确用法:Python、MongoDB、JavaScript与Ajax

    本文主要总结网站编写以来在传递 JSON 数据方面遇到的一些问题以及目前采用的解决方案.网站数据库采用 MongoDB,后端是 Python,前端采用“半分离”形式的 Riot.js,所谓半分离,是说 ...

  3. 【转】Pro Android学习笔记(六):了解Content Provider(中)

    Content Provider的架构 Authority类似web中的域名,每个content provider会通过AndroidManifest.xml向系统注册authority,如下.其中n ...

  4. linux svn 客户端基本使用命令

    1.从svn获取项目 svn co URL --username XX --password XX; 2.添加code file svn add codeFile; svn ci -m "c ...

  5. php array数组(第一部分)

    创建一个数组 <?php $arr = array("My","name","is","zhangsan"); e ...

  6. php中使用mysqli和pdo扩展,测试连接mysql数据库的效率。

    <?php /** * 测试pdo和mysqli的连接效率,各连接100次mysql数据库 */ header("Content-type:text/html;charset=utf8 ...

  7. 有关Linux的.a、.so和.o文件---mark一下(转)

    gcc 生成 .a静态库和 .so动态库   (转载) 我们通常把一些公用函数制作成函数库,供其它程序使用.函数库分为静态库和动态库两种.静态库在程序编译时会被连接到目标代码中,程序运行时将不再需要该 ...

  8. 自定义log4j的appender写es日志

    本篇和大家分享的是自定义log4j的appender,用es来记录日志并且通过kibana浏览es记录:就目前互联网或者一些中大型公司通常会用到第三方组合elk,其主要用写数据到es中,然后通过可视化 ...

  9. 【异步编程】Part3:取消异步操作

    在.Net和C#中运行异步代码相当简单,因为我们有时候需要取消正在进行的异步操作,通过本文,可以掌握 通过CancellationToken取消任务(包括non-cancellable任务).  早期 ...

  10. C++的dllexport和dllimport

    __declspec(dllexport) 声明一个导出函数,是说这个函数要从本DLL导出.我要给别人用.一般用于dll中省掉在DEF文件中手工定义导出哪些函数的一个方法.当然,如果你的DLL里全是C ...