首页 | 新闻 | 新品 | 文库 | 方案 | 视频 | 下载 | 商城 | 开发板 | 数据中心 | 座谈新版 | 培训 | 工具 | 博客 | 论坛 | 百科 | GEC | 活动 | 主题月 | 电子展
返回列表 回复 发帖

开源 Web 应用程序框架 Mavo 入门-4

开源 Web 应用程序框架 Mavo 入门-4

完整的 Poetry Book Club 示例列表 3 是 bookclub2.html,这是从中获取上述片段的整个 HTML 文件。它基于 ,但增加了对 MavoScript 的使用。
清单 3. 使用 Mavo 表达式的 Poetry Book Club                    通知页面
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>The poetry book club</title>

  <link rel="stylesheet" href="https://get.mavo.io/mavo.css"/>
  <script src="https://get.mavo.io/mavo.js"></script>
</head>
<body>
  <main mv-app="poetryclub" mv-storage="local">
    <h1>The poetry book club</h1>

    <p>
      <label>Title: </label>
      <span property="title">Ndewo, Colorado</span>
    </p>
    <img property="cover" style="height: [height * 2 + 200]px;"
     src="//gonzaga.ogbuji.net/~uche/lit/2013/ndewo-cover-small.jpg" alt="cover" />

     <div>
       <input type="range" property="height" />
     </div>

    <p style="background-color: [if(days(meeting - $today) &lt; 7, yellow, white)];">
      <label>Meeting date: </label>
      <time property="meeting" datetime="2017-10-09">9 Oct 2017</time>
    </p>

    <a href="mailto:poclub@example.com?subject=[uppercase(title)]">Contact us about this meeting</a>

  </main>
</body>
</html>




包含动态更改的 Mavo 实际运用Web 浏览器将动态计算并应用样式更改。您可以通过 MavoScript 输入一些简洁的动态响应,这通常需要使用 JavaScript。图 6                显示了将会议日期调整为距当前日期 7 天以内并将图像大小滑块拉到最大值时页面的外观。
图 6. 使用 Mavo 表达式的 Poetry Club 通知
Mavo 的局限性虽然 Mavo 不会减少对程序员的需求,但它仍是一个很棒的工具,可用于创建完全在一个网页中工作的紧凑型应用程序。它的表达式语言 MavoScript                十分周密,但无法扩展 JavaScript 提供的所有功能,包括创建极其复杂的应用程序,这些应用程序需要跨网页序列维护仔细协调的用户会话。Mavo                简化服务器端存储的方法虽然很明智,但绝不适用于大多数应用程序。
存储的实际情况我在本文中的示例仅使用了浏览器的本地存储,这在实践中并不十分有用。在此系列的第 2 部分中,我将向您说明如何将 GitHub 存储后端与 Mavo                配合使用。Mavo 最适用于这种“分块存储”,用户可以在此更新多组内容,然后提交所有更新进行批准。
除此之外,Web                应用程序领域还使用了其他许多存储方法。例如,在线事务数据库(如在电子商务中使用的数据库)可以处理大量用户同时进行的细粒度更改。理论上讲,您可以为                Mavo 编写数据库后端来支持这样一种模型。但在实践中,由于代码十分复杂,且需要为大多数用例调整 Mavo                内置模型的行为,这类存储因此变得过于复杂,而无法与 Mavo 一起使用。
让 Mavo 伴您前行了解 Mavo 的局限性很重要,但不要让这些局限性阻碍您使用这个非常有前途的项目。Mavo 的创建团队通过细致的研究为非编程 Web                专业人员简化编程概念,着力打造令人愉快的用户体验。
Mavo 易于扩展,并且可以与 JavaScript 的全部功能充分交互。这些功能对于 Web                设计人员快速设计原型十分有用,并且可以加快部署分块存储模型非常适用的成熟应用程序。
返回列表