Ale.js

组件对象

开始

当你每次 render 一个组件时,Ale 都会返回一个 Ale组件对象,你可以定义一个变量来接收它:

1
2
3
4
/* 定义一个变量接收 Ale组件对象 */
var app = Ale.render("test", {
/* ...... */
})

让我们点击上方实例,你将会看到它在控制台中输出了它自己的Ale组件对象

高级

可是这造成了一个问题,如果我们的组件需要动态渲染,那我们怎么获取它的 Ale组件对象 呢?

很简单,只需要在支持函数的属性中使用 this 关键字即可获取:

1
2
3
4
5
6
7
8
/* 定义一个组件 */
Ale("test", {
life: {
mounting: function(){
console.log(this) /* 这里this代指渲染完成之后的Ale组件对象 */
}
}
})

在上方实例中,可能你还不了解life属性的作用,不过我们就是给你演示一下如何使用,具体细节请继续往下查看教程!

目前全部支持函数的属性:

  • template (1.0.0之前template属性自动绑定的是this.data,而在1.0.0版本及以后,template属性中使用this代指的是渲染完成后的 ale组件对象,也就是 this【但是你只可以访问ale组件对象的data、staticData、methods属性】)
  • life (life属性本身不支持函数,但是它内部的属性全部支持函数)
  • debug (debug属性本身不支持函数,但是它内部的属性全部支持函数。不过注意,debug内部的函数不会绑定this
  • proxy (proxy属性本身不支持函数,但是它内部的属性全部支持函数。)

找到了一些错误?在Github上编辑!