- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有一个 A 形框架组件,它在某个时候创建一个“基础”实体,上面挂着一堆子元素(基本上是带有彩色面的盒子)。完成所有这些子元素(包括网格)后,我想使用 geometry-merger 合并它们的几何图形。成分。问题是,当我添加此组件时,所有子组件都需要完全初始化:否则,子几何图形将无法正确合并(如果它们在每个子组件中尚不可用)。
我认为等待“base”实体中的 loaded
被触发就足够了,代码如下:
base.addEventListener('loaded', (e) => {
base.setAttribute('geometry-merger', {preserveOriginal: true});
base.setAttribute('material', {vertexColors: 'face'});
});
(在我正在编写的组件的 init
函数中)。
事实上,它在 Firefox 中就像一个魅力,但在 Chrome 中却不然。
我已经对其进行了调试,似乎在 Chrome 中,即使几何图形(属性 3Dobject
)仍未在子项中设置,“已加载”也会在“基础”实体上触发(因此据我了解,它们并未完全“加载”)。
那么,问题是:实体的生命周期中是否有任何事件或某个钩子(Hook)在所有子项初始化时运行?
我找到了一个最小的示例:cubes-loaded.html
和 cubes-loaded.js
,如下:
<!DOCTYPE html>
<html>
<head>
<script src="https://aframe.io/releases/0.9.2/aframe.min.js"></script>
<script src="cubes-loaded.js"></script>
</head>
<body>
<a-scene>
<a-entity cubes position="0 0 -4"></a-entity>
</a-scene>
</body>
</html>
AFRAME.registerComponent('cubes', {
init: function () {
this.base = document.createElement('a-entity');
this.base.addEventListener('loaded', (e) => {
console.log("Base loaded, child object3DMap:", this.base.children[0].object3DMap);
});
this.el.appendChild(this.base);
let box = document.createElement('a-entity');
box.setAttribute('geometry', {primitive: 'box'});
this.base.appendChild(box);
},
play: function () {
console.log("Play run, child object3DMap:", this.base.children[0].object3DMap);
}
});
在 Firefox 中,此示例写道:
Base loaded, child object3DMap: Object { mesh: {…} }
Play run, child object3DMap: Object { mesh: {…} }
在 Chrome 中,此示例写道:
Base loaded, child object3DMap: {}
Play run, child object3DMap: {mesh: J}
顺便说一句,在 play
中运行代码似乎是确保网格物体位于子项中的好方法。
最佳答案
在玩这个最小的例子时,我想我找到了问题的答案。该示例的问题在于,基类是在子级附加到它之前插入到 DOM 中的。这样,“loaded”事件就有可能在子进程初始化完成之前被触发,显然 Chrome 就是这么做的。在 Firefox 中,似乎在子进程初始化之前不会触发该事件,至少在本例中是这样。
因此,只需在将子级附加到 DOM 之后,将基础附加到 DOM 即可修复该示例:
AFRAME.registerComponent('cubes', {
init: function () {
this.base = document.createElement('a-entity');
this.base.addEventListener('loaded', (e) => {
console.log("Base loaded, child object3DMap:", this.base.children[0].object3DMap);
});
let box = document.createElement('a-entity');
box.setAttribute('geometry', {primitive: 'box'});
this.base.appendChild(box);
this.el.appendChild(this.base);
}
});
抱歉打扰了,一旦您了解了附件的顺序,答案就很简单了。
关于javascript - A 型框架 : When are all my children fully initialized?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58980454/
假设我想在存储在变量中的特定表中导航。 我想在表的 thead 中找到 tr 中的所有输入。 如果我有表的 ID,我会这样做 - $('#mytable thead tr input') 但是假设我已
我是 React 新手,我正在尝试了解一般语法的工作原理,但不确定在这里提问是否合适。以下是我的一个简单标题组件的代码。 export default class Title extends Comp
我正在尝试实现在树结构中获取 child 的 child 的可能性。 这是我想要的例子。 到目前为止我做了什么。 class Children(list): def __init__(self
我一直在尝试让它工作一段时间,但不确定如何执行以下操作。我的表单组件有包含常规 html 标记和输入的子组件。如果 child 是输入,我想添加 attachToForm 和 detachFromFo
在本文档中 https://flutter.dev/docs/development/ui/layout#nesting-rows-and-columns 他们使用 children : 但是在 An
即使我只向表中添加一项内容,我似乎也无法弄清楚为什么会显示重复的子项添加错误。 有 3 个主要类: WindowTease:加载舞台并调用 loadTable() 方法 InventoryContro
我一直在查看以前提出的问题,但似乎找不到适合我的情况的解决方案... 我希望能够循环遍历所有 child 和 child 的 child 等等...... 设计中的标记看起来与此类似
这个问题在这里已经有了答案: How can I use jQuery methods on elements accessed by brackets notation? (2 个答案) 关闭 5
我有一个场景,我知道我正在寻找的 div 恰好是两层深。 使用效率是否更高: $('#mydiv').find('.myselector') 或 $('#mydiv').children().chil
我今天有一个很奇怪的问题:我有一个水平显示一些缩略图的 RecyclerView,我使用 smoothScrollToPosition 导航到我需要的项目,但我注意到一个问题:它不会滚动到最后一项。进
只有 JS,没有 Jquery。 如何获取容器的所有子节点,然后为每个子节点获取子节点? 我不想将 ID 添加到作为网格行子级的每个包装器,我尝试使用“this”或此索引进行定位。该脚本应该是动态的,
任务:在“注释”类的任何段落内的有序列表中强调强调的文本。这是我目前所拥有的... .note>p>ol>em{text-decoration:underline;} 我正在努力让它继续下去。我的代码
我有两个类如下: --- CSS: .shw-intro { width: 250px; height: 150px; background: rgb(95, 190, 0);
当前的 Firebase 数据库结构: 我要实现的目标: 在我所有位置的任何“促销”子项中搜索等于某物的优惠券。 如果找到,将其“limit”参数减少 -1 来更新它 我当前的代码: mDat
我有一个 html 表,想要获取所有行。但是,在 DebugElement 或 NativeElement 上调用 .children 会返回不同的顺序。 我的 table : 1
我在使用 Element.children 时注意到一个奇怪的问题并且似乎没有找到好的解决方法。 示例 1(预期行为) 拿这个 HTML: 还有这个 JS const formElem
目标是选择任何后代 - 无论直系后代指示如何 - 但不选择他们的 child 。换句话说,如果我从文档中搜索,我希望找到目标选择器未包含的所有子元素: test t
当我尝试执行 ParentNode.children 时,显示无法读取未定义的属性“children”。尝试让父节点的所有子节点的背景颜色为粉红色。 现在,我有一个以半小时为增量的表格,根据上午 8
我不确定这是否可行,但这是我想在 Reactjs 中实现的目标: 所以我想做的是,我想使用 React.cloneElement API 将 Comp1 组件的 pro
更新:我在另一台安装更干净的机器上试过这个。我无法在那台机器上重现这个。如果我发现是什么有问题的 (VSStudio) 组件导致了这种情况,我会告诉你的。 我从后面的代码创建了一些 UIElement
我是一名优秀的程序员,十分优秀!