搜索
查看: 3355|回复: 0

[web] aardio调用百度MVVM框架San简单示例

[复制链接]

185

主题

2541

帖子

1万

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
13973
发表于 2018-4-13 17:28:06 | 显示全部楼层 |阅读模式
San,是一个 MVVM 的组件框架。
它体积小巧(12.6K),兼容性好(支持所有浏览器环境),性能卓越,是一个可靠、可依赖的实现响应式用户界面的解决方案。官网:https://baidu.github.io/san/

因为小,简洁,所以用法也很简单,下面是一个简单的例子:
import win.ui;
/*DSG{{*/
var winform = win.form(text="百度MVVM框架San测试";right=759;bottom=469)
winform.add(
button={cls=
"button";text="在aardio中获取数据";left=352;top=387;right=664;bottom=451;z=1}
)
/*}}*/

import web.form;
var wb = web.form( winform );

wb.external={
    inputName =
function(str){
        winform.text = str;
    }
}

wb.html =
/**
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Quick Start</title>
    <script src="http://download.aardio.com/cdn/san.js"></script>
</head>

<body>
    <script>
        var MyApp = san.defineComponent({
            template: ''
                + '<div>'
                + '<input value="{= name =}" placeholder="请输入">'
                + 'Hello {{name}}!'  
                + ' <button on-click="capture:btnClick">点这里</button>'
                + '</div>',
     
            btnClick: function (title) {
                alert('Button');
            },
            getName: function(){
                return this.data.get("name");
            },
            updated: function(){
                //响应视图更新事件,调用aardio函数
                external.inputName(this.data.get("name"));
            }
        });
        
        var myApp = new MyApp();
        myApp.attach(document.body);
        </script>
</body>

</html>
**/


winform.button.oncommand =
function(id,event){
   
   
//获取san组件
    var san = wb.script.myApp;
   
   
//调用san组件的函数,获取san组件的数据
    winform.msgbox( san.getName()  )
}

winform.show();
win.loopMessage();


回复

使用道具 举报

您需要登录后才可以回帖 登录 | 注册会员

本版积分规则

手机版|未经许可严禁引用或转载本站文章|站长邮箱|aardio.com|aardio官方社区 ( 皖ICP备09012014号 )

GMT+8, 2018-10-16 11:14 , Processed in 0.046875 second(s), 23 queries .

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表