您如何以DRY方式复制aframe-room-component?

时间:2018-10-11 14:55:55

标签: duplicates dry aframe

我正在尝试使用aframe-room-component创建许多建筑物。与我目前使用的方法相比,有没有更多的DRY方法来复制rw-room实体(实际上只是添加多个rw-room的方法。

我已经考虑在index.js中编写一个组件,但是由于试图合并aframe-room-component而感到困惑。

<rw-room outside="true" position="0 0 -10" material="color: #866; side: double">
        <rw-ceiling></rw-ceiling>
        <rw-floor></rw-floor>
        <rw-wall position="4 0 0"></rw-wall>
        <rw-wall position="4 0 4"></rw-wall>
        <rw-wall position="0 0 4"></rw-wall>
        <rw-wall position="0 0 0">
            <rw-doorhole id="holeA"></rw-doorhole>
            <rw-doorlink from="#holeA" to="#holeB" position="2.5 0 0"></rw-doorlink>
        </rw-wall>
      </rw-room>
      <rw-room outside="true" side="double" position="4 0 -2" material="color: #866; side: double">
          <rw-wall position=" 1 0  1"  side="double" material="color:#877; side: double">
              <rw-doorhole id="holeB"></rw-doorhole>
          </rw-wall>
      </rw-room>

      <rw-room outside="true" position="-3 0 -10" rotation="0 180 0" material="color: #866; side: double">
          <rw-ceiling></rw-ceiling>
          <rw-floor></rw-floor>
          <rw-wall position="4 0 0"></rw-wall>
          <rw-wall position="4 0 4"></rw-wall>
          <rw-wall position="0 0 4"></rw-wall>
          <rw-wall position="0 0 0">
              <rw-doorhole id="holeC"></rw-doorhole>
              <rw-doorlink from="#holeC" to="#holeD" position="2.5 0 0"></rw-doorlink>
          </rw-wall>
        </rw-room>
        <rw-room outside="true" side="double" position="4 0 -2" material="color: #866; side: double">
            <rw-wall position=" 1 0  1"  side="double" material="color:#877; side: double">
                <rw-doorhole id="holeD"></rw-doorhole>
            </rw-wall>
        </rw-room>

希望这很清楚,在此先感谢您!

1 个答案:

答案 0 :(得分:1)

类似:

  • A框架模板组件https://www.npmjs.com/package/aframe-template- 组件。
  • 或者具有一个以字符串形式转储到innerHTML中的组件,使用正则表达式或字符串替换来构建模板。可以选择通过<template>标签定义字符串。