Question

我想通过操纵“ visible”属性，使用被调用到HTML代码上的localStorage隐藏一个aframe对象。

我浏览了其他文章，例如How can I hide an element with A-Frame?

但这对我不起作用。

以下是我的代码：

  <a-obj-model
  visible = "localStorage.getItem('carVisibility')";
   id="carA"  src="#car_obj" mtl="#car_mtl" position="1 1 7" rotation="0 0 0"></a-obj-model>

我的carVisibility localStorage设置为“ false”和“ true”，具体取决于用户的输入。如果我将localStorage部分替换为“ visible = false;”，它完美地工作。但是，一旦添加了localStorage部分，它似乎就无法连接并正常工作。很明显这是一个语法错误，但是，我不确定这是怎么回事？

Answer 1

visible: ...期望值为true或false。您无法在其中放置js代码，例如visible="1 === 2"。示例here。

您应该将逻辑放在aframe组件中：

AFRAME.registerComponent("foo", {
  init: function() {
    // provided carVisibility is true or false
    this.el.setAttribute("visible", localStorage.getItem('carVisibility'))
  }
}

并像这样使用它

<a-entity foo></a-entity>

工作示例here。将localStorage设置为true或false，启动并重新启动小提琴（以确保已设置本地存储）。

Answer 2

您确定值=“ localStorage ............”不会被视为字符串吗？

Answer 3

尝试一下，

$(document).ready(function(){
    $('#carA').attr('visible', localStorage.getItem('carVisibility'));
});

如何使用localStorage和“ visible”属性隐藏aframe对象？

3 个答案: