Cpage.js给组件绑定事件的实现代码

Cpage.js是一款轻量级的Mvvm框架，使用TypeScript（JavaScript的超集）开发。内置模板引擎，路由

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给组件绑定事件的实现代码，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！

cpage.js 组件 cpage.js 绑定事件