Aframe注册组件添加onclick属性 [英] aframe register componet add onclick attribute
本文介绍了Aframe注册组件添加onclick属性的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我想使用aframe
创建动态组件，但是我无法在组件上添加onclick
I want to create dynamic componet using aframe But I cannot add onclick on my component
这是我的代码
AFRAME.registerComponent('cylinders', {
init: function(){
let el = this.el;
let sceneEl = document.getElementById('scene1');
let cyl = document.createElement('a-cylinder');
cyl.setAttribute('position', '0 0 0');
cyl.setAttribute('rotation', '0 0 0');
cyl.setAttribute('scale', '0 0 0');
cyl.setAttribute('radius', 1);
cyl.setAttribute('height', 0.1);
cyl.setAttribute('color', '#39BB82');
cyl.setAttribute('checkpoint', '');
cyl.setAttribute('class', 'clickable');
cyl.setAttribute('onclick', 'myFunction()');
sceneEl.appendChild(cyl);
}
}
});
我的代码工作正常，但是我无法设置onlick。如果我这样写，可以使用onclick。
my code working fine, but I cannot set onlick. If i write like this bottom I can use onclick.
<a-cylinder
class="clickable"
checkpoint=""
radius="1"
height="0.1"
position="0 0 0"
rotation="0 0 0"
scale="0 0 0"
onclick="myFunction()"
color="#39BB82">
</a-cylinder>
有人可以帮助我吗？我只需要registerComponent与onclick一起使用
can some one help me? I just need registerComponent working with my onclick
推荐答案
了解有关 a光标
Read about a-cursor
//https://aframe.io/docs/1.0.0/guides/building-a-minecraft-demo.html#try-it-out<script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-teleport-controls@0.2.x/dist/aframe-teleport-controls.min.js"></script>
<script src="https://unpkg.com/aframe-controller-cursor-component@0.2.x/dist/aframe-controller-cursor-component.min.js"></script>
<script src="https://rawgit.com/ngokevin/kframe/csstricks/scenes/aincraft/components/random-color.js"></script>
<script src="https://rawgit.com/ngokevin/kframe/csstricks/scenes/aincraft/components/snap.js"></script>
<script src="https://rawgit.com/ngokevin/kframe/csstricks/scenes/aincraft/components/intersection-spawn.js"></script>
<body>
<a-scene>
<a-assets>
<img id="groundTexture" src="https://cdn.aframe.io/a-painter/images/floor.jpg">
<img id="skyTexture" src="https://cdn.aframe.io/a-painter/images/sky.jpg">
<a-mixin id="voxel"
geometry="primitive: box; height: 0.5; width: 0.5; depth: 0.5"
material="shader: standard"
random-color
snap="offset: 0.25 0.25 0.25; snap: 0.5 0.5 0.5"
></a-mixin>
</a-assets>
<a-cylinder id="ground" src="#groundTexture" radius="30" height="0.1"></a-cylinder>
<a-sky id="background" src="#skyTexture" theta-length="90" radius="30"></a-sky>
<!-- Hands. -->
<a-entity id="teleHand" hand-controls="left" teleport-controls="type: parabolic; collisionEntities: [mixin='voxel'], #ground"></a-entity>
<a-entity id="blockHand" hand-controls="right" controller-cursor intersection-spawn="event: click; mixin: voxel"></a-entity>
<!-- Camera. -->
<a-camera>
<a-cursor intersection-spawn="event: click; mixin: voxel"></a-cursor>
</a-camera>
</a-scene>
</body>
这篇关于Aframe注册组件添加onclick属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
