首页 > 编程 > JavaScript > 正文

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

2019-11-19 15:35:52
字体:
来源:转载
供稿:网友

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

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表