Cpage.js给组件绑定事件的实现代码
时间:2019-03-31
本文章向大家介绍Cpage.js给组件绑定事件的实现代码,主要包括Cpage.js给组件绑定事件的实现代码使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
Cpage.js是一款轻量级的Mvvm框架,使用TypeScript(JavaScript的超集)开发。
内置模板引擎,路由,指令,http,dom等模块。可以方便地进行组件化开发,语法统一、易用,不依赖于第三方框架,适合中小项目开发。
Cpage.js不仅可以给普通元素绑定事件,也可以给组件绑定事件!
首先,我们可以定义一个组件header
var header = Cpage.component({ name: 'header', components: [], template: `<div>{{header}}--{{height}}</div>`, data: { header: 'this is header' }, props: { height: { default: '10' } }, beforeRender() { }, render() { } });
之后,在需要使用的地方引用他
<div> <div class="main" c-click="handelIf()">my app--templateId</div> <div c-if="{{ifTest}}"> <article></article> </div> <header height="{{headerHeight}}" c-click="headerClick()" ></header> <article></article> <footer></footer> </div>
在组件上可以使用c-事件 的方式绑定事件
总结
以上所述是小编给大家介绍的Cpage.js给组件绑定事件的实现代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!
- Android NDk环境配置
- 谷歌再曝Windows8.1漏洞,微软怒了
- Python机器学习的生态系统
- TP-link TL-WR840N系列路由器存在CSRF漏洞,可修改任意配置(含POC测试过程)
- JavaScript严格模式
- 微软修复8个安全漏洞,包括谷歌披露的0day漏洞
- PullToRefreshScrollView 嵌套RecyclerView实现特卖列表倒计时抢购
- 全栈数据工程师养成攻略:Python 基本语法
- 从卷积神经网络的角度看世界
- 外观模式
- 透析挖洞神器mona.py插件新特性
- Python学习没有捷径,但可以加速,零基础九天你也可以会编程
- Activity状态和生命周期方法
- Arp欺骗原理及Android环境下的检测方法
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Mybatis源码学习第六天(核心流程分析)之Executor分析
- EasyPoi导出Excel
- 盘点 15 个好用的 API 接口管理神器
- JVM学习第二天(垃圾回收器和内存分配策略)大章
- JVM学习第一天(虚拟机的前世今生与与Java的内存区域)
- Android进阶:Binder那么弱怎么面大厂?
- Mybatis源码学习第七天(PageHelper分析)
- 【小程序】728- 小程序如何生成海报分享朋友圈
- Mybatis源码学习第七天(插件源码分析)
- Mybatis源码学习第七天(插件开发原理)
- Mybatis源码学习第六天(核心流程分析)之Executor分析(补充)
- 无法用排他锁锁定该数据库,以执行该操作。 (Microsoft SQL Server,错误: 5030)
- Spring security OAuth2.0认证授权学习第四天(SpringBoot集成)
- php hash算法类
- Spring security OAuth2.0认证授权学习第三天(认证流程)