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. 2012年浙大:Sharing

    题目描述: To store English words, one method is to use linked lists and store a word letter by letter. T ...

  2. POJ(有向图求LCA)

    Closest Common Ancestors Time Limit: 2000MS   Memory Limit: 10000K Total Submissions: 18013   Accept ...

  3. POJ3694(求割边)

    Network Time Limit: 5000MS   Memory Limit: 65536K Total Submissions: 7943   Accepted: 2893 Descripti ...

  4. poco时间操作

    Poco::DateTime Poco::Timespan Poco::Timestamp 时间操作 Poco::DateTime dt; //c++ 20才有 Calendar dt = dt + ...

  5. C# 清除cookies

    不同的浏览器会把cookie文件保存在不同的地方 以下是C# WebBrowser控件cookies的存放路径 C:\Users\{你的帐号名}\AppData\Local\Microsoft\Win ...

  6. Elasticsearch之match_phrase小坑记录

    1.问题抛出 某个词组在Elasitcsearch中的某个document中存在,就一定通过某种匹配方式把它搜出来. 举例: title=公路局正在治理解放大道路面积水问题. 输入关键词:道路,能否搜 ...

  7. go实现冒泡排序和快速排序

    项目结构 冒泡排序算法,源文件bubblesort.go package bubblesort // 冒泡排序 func BubbleSort(values []int) { for i := 0; ...

  8. 牛客想开了大赛2 A-【六】平面(切平面)

    A-[六]平面 链接:https://ac.nowcoder.com/acm/contest/907/A?&headNav=acm来源:牛客网 时间限制:C/C++ 1秒,其他语言2秒 空间限 ...

  9. 判断ip地址是否为内网ip或局域网ip

    bool IsLanIp(string& ip) { ,) == ,) == ,) == "192.") { return true; } else { return fa ...

  10. HDU 3410【单调栈】

    思路: 单调栈. 鄙人的记忆:按当前为最大值的两边延伸就是维护单调递减栈. //#include <bits/stdc++.h> #include <iostream> #in ...