avalon2 第一个demo
<!DOCTYPE html> <html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> </head>
<body ms-controller='test'>
<h1>soleSlot的使用, 它会组件容器中innerHTML替换生成组件的slot元素</h1>
<div >
<xmp :widget="{is:'ms-button'}" :click="@ddd" :attr="{title:@bb}">{{@bb}}</xmp>
{{aaaa}}
<p><button :click="@click">click</button></p> </div> {{name}} <script src="lib/jquery-1.8.3.min.js"></script>
<script src="lib/avalon.js"></script>
<script src="js/test.js"></script>
</body>
</html>
var vm;
function initVm() {
avalon.component('ms-button', {
template: '<button type="button"><span><slot /></span></button>',
defaults: {
buttonText: "button"
},
soleSlot: 'buttonText'
})
avalon.ready(function() {
vm = avalon.define({
$id: 'test',
aaa: {
buttonText: "vm中的值"
},
bb: '动态内容',
aaaa: '动态内1容',
name: 'lslsl',
ddd: function() {
console.log('xxxx')
},
click: function() {
vm.bb = '更新内容' + (new Date - 0)
}
})
avalon.scan(document.body);
});
}
$(function() {
initVm();
});
avalon2 第一个demo的更多相关文章
- angular开发者吐槽react+redux的复杂：“一个demo证明你的开发效率低下”
曾经看到一篇文章,写的是jquery开发者吐槽angular的复杂.作为一个angular开发者,我来吐槽一下react+redux的复杂. 例子 为了让大家看得舒服,我用最简单的一个demo来展示r ...
- 初识nginx之第一个demo
商城项目做了一个多月了,想到必须用到负载均衡,简单了解了一下nginx,首先分享第一个demo,五月份上线后,会继续分享一系列相关知识. 在nginx根目录下,用了一个园友的批处理文件nginx.ba ...
- springMvc的第一个demo
1.下载jar包 http://repo.spring.io/libs-release-local/org/springframework/spring/4.2.3.RELEASE/ 2.下载源码 j ...
- Android 通知栏Notification的整合 全面学习 （一个DEMO让你完全了解它）
在android的应用层中,涉及到很多应用框架,例如:Service框架,Activity管理机制,Broadcast机制,对话框框架,标题栏框架,状态栏框架,通知机制,ActionBar框架等等. ...
- 如何在WTL和MFC中使用duilib及如何静态使用duilib库！（初级讲解 附带一个Demo）
关于duilib的历史,我也就不多说了,能看到这篇文章的人都是有一定了解才能找到这个的. 我直接说下对这个库的基本使用吧. 我个人对一些好技术都是比较感兴趣的. 因为个人原因 喜欢接触一个好技术. 所 ...
- 白盒测试之gtest第一个demo
认识gtest工具后,关于它的使用,下面将用一个demo程序演示一下gtest的用法以及成果展示. 一.需要测试的C++代码: #include "myfunction.h" // ...
- 在VS中实现webService的一个demo（图解）
在VS中实现webService的一个demo(图解) 先创建一个web项目,创建好web项目后,添加新建项——web服务 在新建好的web服务文件中写如下代码: 生成当前解决方案. 新建一个winf ...
- Cocos2d-x 学习（1）—— 通过Cocos Studio创建第一个Demo
近期在工作上有了比較大的转变,自学情绪也慢慢高涨,本来一直在研究unity的技术.由于换了工作会開始接触cocos2d-x.但并不意味着停止研究unity,以后有时间还是会继续的. 公司的cocos2 ...
- 使用android的mediaplayer做成 一个demo,欢迎测试使用
附件是为一个定制视频产品而简单的写了一个demo,用来说明android的mediaplayer是如何使用的. http://files.cnblogs.com/guobaPlayer/palyerD ...
随机推荐
- 如何用git将项目代码上传到github - CSDN博客
配置Git 我们先在电脑硬盘里找一块地方存放本地仓库,比如我们把本地仓库建立在C:\MyRepository\1ke_test文件夹下 进入1ke_test文件夹 鼠标右键操作如下步骤: 1)在本地仓 ...
- h5滚动页面固定导航
1.需要效果 2.实现方法 (1)原生js实现 document.addEventListener('scroll', function (event) { var scrollDamo = wind ...
- 通过sql 向数据库插入多行语句
我们知道通过insert into 表名(列名) values(值)是向表中插入一条语句,可是当我们需要向数据库插入多条语句时,应该怎么做呢? 可以通过如下格式的sql 语句来实现一次向数据库插入多行 ...
- pip 异常问题
场景:安装的python版本为3.6.4 在使用pip命令时,出现错误:Did not provide a command 如下图所示: 解决办法:pip带上后缀.exe 为什么会出现这种情况? 主要 ...
- at: 安排一个任务在未来执行，需要一个atd的系统后台进程
检查atd进程是否启动 [root@centos61 桌面]# service atd status atd (pid 2274) 正在运行... [root@centos61 桌面]# chkco ...
- Amazon Redshift数据迁移到MaxCompute
Amazon Redshift数据迁移到MaxCompute Amazon Redshift 中的数据迁移到MaxCompute中经常需要先卸载到S3中,再到阿里云对象存储OSS中,大数据计算服务Ma ...
- java通过实体类组装报文
条件: 1.实体类字段名 首字母小写(java规范),再通过报文的需求,填充的时候做对应修改即可(正常报文首字母是大写的)! 2.假如xml标签首字母是小写,那么实体类就给大写,首字母是大写,那么实体 ...
- FastAdmin 自学教程 - 目录（持续更新）（2019-10-11）
FastAdmin 自学教程 - 目录 本自学教程将不定期更新. 了解 FastAdmin FastAdmin 开发第 1 天:了解 FastAdmin 框架 FastAdmin 开发第 2 天:安装 ...
- PHPCMS快速建站系列之常用标签
<span class="Nmore"><a href="/index.php?m=content&c=index&a=lists&am ...
- Kubernetes Ingress日志分析入门
本文主要介绍如何基于日志服务构建Kubernetes Ingress日志分析平台,并提供一些简单的动手实验方便大家快速了解日志服务相关功能. 部署Ingress日志方案 登录容器服务管理控制台. 将上 ...