# 嵌套

Bling 组件可以嵌套使用,例如:

<bling
  className="container"
  ref="containerBlingRef"
  show="{{true}}"
>
  <flex
    className="sprite-cell"
    direction="column">
    <bling
      className="bling"
      ref="spriteBlingRef">
      <image src="/images/realize/sprite.png" />
    </bling>
  </flex>
</bling>
const { Bling } = $global;

const refs = {
  containerBlingRef(ref) {
    this.containerBlingRef = ref;
  },
  spriteBlingRef(ref) {
    this.spriteBlingRef = ref;
  },
};

Page({
  onReady() {
    const shakeAction = Bling.Shake(150, 5);
    const fadeOutAction = Bling.FadeOut(500);

    shakeAction.on('complete', () => {
      this.containerBlingRef.hide();
      Bling.Engine.getInstance().destroy();
    });
    this.spriteBlingRef.runAction(shakeAction);
    this.containerBlingRef.runAction(fadeOutAction);
  },
  ...refs,
});