grootjs 简明教程

2021-12-06 10:12:05

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>