# Shadow元素
有时候我们需要用代码动态创建元素之后添加到场景中,这个需求和wxml
写标签这种静态的模板编译方式是冲突的,为了保证DOM树不混乱,我们提供了类似于HTML中的ShadowRoot
的XRShadow元素,对应于xml
中的xr-shadow
标签,来解决这个问题。
# 一个例子
让我们以一个例子来说明如何使用Shadow元素,首先在xml
中定义:
<xr-shadow id="shadow" position="0 1 0" />
之后便可以在代码中使用:
const shadow = scene.getElementById('shadow');
const node = scene.createElement(xrFrameSystem.XRNode);
// 添加创建的节点到`shadow`节点下
shadow.addChild(node);
// 移除创建的节点
shadow.removeChild(node);
# 特别注意
在实际使用中我们有一些特别要注意的地方:
- Shadow元素派生自节点元素,拥有3D变换的能力。
- 在
wxml
中,Shadow元素下绝对不能有子元素!!!当然如果这么做了框架会报错。 - 动态创建的元素仅能添加为Shadow元素的子/孙元素,这个框架不会检查,出了问题后果自负。
- Shadow元素以及子元素的
release
需要自己处理,remove
后能够继续复用重新add
!