grootjs 简明教程
grootJs简明教程
mvvm框架也是解决的一类问题,在某些时候会提高生产效率;
经过接近一个月的努力,grootJs测试版终于发布了
grootJs是一个mvvm的框架,名字取 grass 和root 两个单词的组合,既“草根”之意。在创作的中,本着尽量简单实用的原则构思完成的
grootJs不同于其他mvvm的三大亮点:
1.model模型自动回收。在框架中加入了垃圾回收机制,程序员不回再为了因不断创建大量modle不能回收,或不便于回收造成内存占用太高而烦恼
2.全新的变量值变化监模型,改善其他mvvm框架对一些动态数组中得变量变化不便于监控的问题
3.全新的ui控件开发接口,是控件的值和页面页面模型的值实现同步,操作开发的控件时 就像操作html内置控件一样
还有更多的新的东西等待你的发觉....
项目地址 https://github.com/time-go/grootJs
Grootjs官网(最新文档在官网更新)
官网:http://time-go.github.io/grootJs
作者联系方式:qq289880020,官方技术支持QQ群330603020 如有bug 疑问 或问题 请联系作者:-)
Hello word(index1.html)
博客园上的教程不再更新
<html>
<head>
<title>hello word</title>
<script src="jquery-1.11.2.min.js"></script>
<script src="groot.js"></script>
</head>
<body>
<div gt-view="myview">
<div gt-object="data">
<input type="text" gt-value-change="say">+<input type="text" gt-value-change="say2"><span
gt-text="{say}+{say2}"></span>
</div>
<input type="button" value="点击" gt-click="fuzhi">
</div>
</body>
</html>
<script>
groot.view("myview", function (vm, ve) {
vm.data = {
say: 1,
say2: 2
}
/*vm.say = 1;
vm.say2 = 20;*/
ve.fuzhi = function () {
vm.data = {say: 10, say2: 50}
vm.dataRender();
}
})
</script>
说明:程序中首先引jquery,框架的docment操作都是基于jquery的。
gt-view="myview" 是定义一个作用于为myview的范围,对应的在js里也有一个 groot.view("myview"...,这个两个是相对应得;
vm是数据模型,它有个属性为say,gt-value-change=“say”为绑定这个say属性 change 表示 输入框的值变化 vm中say的值就变化;
相应 change该为blur,就 是 输入框失去焦点的时候 vm.say得值变化;gt-text="say"得意义找个标签的内容绑定vm.say的值;
大家可以看到随着输入框的值变化,右边标签的值也在变化
目录
$self $index $first $last parent() outerParent()
grootjs 简明教程的更多相关文章
- 2013 duilib入门简明教程 -- 第一个程序 Hello World(3)
小伙伴们有点迫不及待了么,来看一看Hello World吧: 新建一个空的win32项目,新建一个main.cpp文件,将以下代码复制进去: #include <windows.h> #i ...
- 2013 duilib入门简明教程 -- 部分bug (11)
一.WindowImplBase的bug 在第8个教程[2013 duilib入门简明教程 -- 完整的自绘标题栏(8)]中,可以发现窗口最大化之后有两个问题, 1.最大化按钮的样式 ...
- 2013 duilib入门简明教程 -- 部分bug 2 (14)
上一个教程中提到了ActiveX的Bug,即如果主窗口直接用变量生成,则关闭窗口时会产生崩溃 如果用new的方式生成,则不会崩溃,所以给出一个临时的快速解决方案,即主窗口 ...
- 2013 duilib入门简明教程 -- 自绘控件 (15)
在[2013 duilib入门简明教程 -- 复杂控件介绍 (13)]中虽然介绍了界面设计器上的所有控件,但是还有一些控件并没有被放到界面设计器上,还有一些常用控件duilib并没有提供(比如 ...
- 2013 duilib入门简明教程 -- 事件处理和消息响应 (17)
界面的显示方面就都讲完啦,下面来介绍下控件的响应. 前面的教程只讲了按钮和Tab的响应,即在Notify函数里处理.其实duilib还提供了另外一种响应的方法,即消息映射DUI_BEG ...
- 2013 duilib入门简明教程 -- FAQ (19)
虽然前面的教程几乎把所有的知识点都罗列了,但是有很多问题经常在群里出现,所以这里再次整理一下. 需要注意的是,在下面的问题中,除了加上XML属性外,主窗口必须继承自WindowImpl ...
- Mac安装Windows 10的简明教程
每次在Mac上安装Windows都是一件非常痛苦的事情,曾经为了装Win8把整台Mac的硬盘数据都弄丢了,最后通过龟速系统恢复模式恢复了MacOSX(50M电信光纤下载了3天才把系统下载完),相信和我 ...
- Docker简明教程
Docker简明教程 [编者的话]使用Docker来写代码更高效并能有效提升自己的技能.Docker能打包你的开发环境,消除包的依赖冲突,并通过集装箱式的应用来减少开发时间和学习时间. Docker作 ...
- 2013 duilib入门简明教程 -- 总结 (20)
duilib的入门系列就到尾声了,再次提醒下,Alberl用的duilib版本是SVN上第个版本,时间是2013.08.15~ 这里给出Alberl最后汇总的一个工程,戳我下载,效 ...
随机推荐
- 挖一挖C#中那些我们不常用的东西之系列(5)——FlagAttribute
说到FlagsAttribute,源自前几天看到了一小段代码,大概意思就是根据航班政策来返回哪些配送方式是否可用,根据这些是否可用 来隐藏或者开启界面的相关配送方式,如果大家订过机票可能知道配送方式有 ...
- Zookeeper 服务注册和发现
Zookeeper 分布式服务框架是 Apache Hadoop 的一个子项目,它主要是用来解决分布式应用中经常遇到的一些数据管理问题,如:统一命名服务.状态同步服务.集群管理.分布式应用配置项的管理 ...
- 4、解决native库不兼容
解决native库不兼容 现象: 报警告 [root@hadoop1 hadoop-]# bin/hdfs dfs -ls /input // :: WARN util.NativeCodeLoade ...
- ES6 Set/WeakSet
ES6里加入了一个新数据解构Set,和Java的Set一样,它里面不存放重复的元素.Set实现为一个类,使用时需要先new. var s1 = new Set() s1.add(1) s1.add(2 ...
- 基于Qt5.5.0的sql,C++备忘录软件的编写
我的第一个软件. 基于Qt5.5.0的 sql ,C++备忘录软件version1.0的编写 我用的Qt版本是5.5.0免配置编译器的版本,这里附上我使用的软件下载地址:http://download ...
- Linux autojump命令
一.简介 autojump是一个命令行工具,它允许你可以直接跳转到你喜爱的目录,而不用管你现在身在何处. 二.安装 yum install autojump 三.用法 j [目录的名字或名字的一部分] ...
- IIS中查看W3P.exe进程对应的应用程序池的方法
对于IIS6可以运行 iisapp -a来显示应用程序池的性能列表. iisapp.vbs它是一个脚本程序,在安装2003时需要SP1才有 而IIS7可以直接用它的外壳命令 C:"Windo ...
- monkeyrunner之eclipse中运行monkeyrunner脚本之环境搭建(四)
monkeyrunner脚本使用Python语法编写,但它实际上是通过Jython来解释执行. Jython是Python的Java实现,它将Python代码解释成Java虚拟机上的字节码并执行,这种 ...
- 理解 OpenStack Swift (3):监控和一些影响性能的因素 [Monitoring and Performance]
本系列文章着重学习和研究OpenStack Swift,包括环境搭建.原理.架构.监控和性能等. (1)OpenStack + 三节点Swift 集群+ HAProxy + UCARP 安装和配置 ( ...
- POJ 1584 A Round Peg in a Ground Hole --判定点在形内形外形上
题意: 给一个圆和一个多边形,多边形点可能按顺时针给出,也可能按逆时针给出,先判断多边形是否为凸包,再判断圆是否在凸包内. 解法: 先判是否为凸包,沿着i=0~n,先得出初始方向dir,dir=1为逆 ...