渲染周期
从创建元素到完成渲染会经历数据变化、请求渲染、布局、渲染等一系列过程,从而形成一次完整的渲染生命周期。
示例
生命周期中的不同状态会通过 ChildEvent、 PropertyEvent、 WatchEvent、 LayoutEvent、 RenderEvent等事件进行通知,你也可以通过 Leafer 实例监听这些事件实现自己的产品逻辑。
监听渲染事件
ts
import { Leafer, Rect, RenderEvent } from 'leafer-ui'
const leafer = new Leafer({ view: window })
const rect = new Rect({ x: 100, y: 100, fill: '#32cd79', draggable: true })
leafer.add(rect)
leafer.on(RenderEvent.BEFORE, function () {
// render before (Layout has ended)
})