Функция обновления пользовательских компонентов Aframe не запускается - PullRequest
0 голосов
/ 18 июня 2020

Функция обновления пользовательского компонента, который я написал, не запускается, когда используется "setAttribute", и я не уверен, почему.

Первоначально я подумал, что это может быть потому, что я создавал настраиваемое поле -door "отдельно и изменяя атрибуты перед помещением их в мою a-сцену, но функция обновления по-прежнему не срабатывала даже после того, как я дождался, пока эти объекты будут помещены в a-сцену.

Я также пробовал использовать указанный здесь прослушиватель событий обновление не запускается в компоненте кадра , но не видел никаких отладочных сообщений от прослушивателя.

Единственный вывод Я вижу одно сообщение «ОБНОВЛЕНИЕ ФУНКЦИИ HIT» после инициализации объекта «дверь-ящик». Я никогда больше не вижу результат, несмотря на все вызовы setAttribute, как показано ниже.

Вот определение моего компонента (обратите внимание, что reconate_walldoor создает me sh и инициализирует объект по желанию):

AFRAME.registerComponent('box-door', {

schema: {
    width: {type: 'number', default: 10},
    height: {type: 'number', default: 5},
    depth: {type: 'number', default: 1},
    doorwidth: {type: 'number', default: 3},
    doorheight: {type: 'number', default: 4},
    dooroffset: {type: 'number', default: 3.5},
    color: {type: 'color', default: '#AAA'}
  },

init: function () {
    var data = this.data;
    var el = this.el;
    recreate_walldoor(el, data);

    this.el.addEventListener('componentChanged',function(e){
        console.log("LISTENER TRIGGERED");
    });

  },

    /*
   * Update the mesh in response to property updates.
   */
  update: function (oldData) {
    var data = this.data;
    var el = this.el;

    console.log("UPDATE FUNCTION HIT...");

    // If `oldData` is empty, then this means we're in the initialization process.
    // No need to update.
    if (Object.keys(oldData).length === 0) { console.log("exit"); return; }

    // Geometry-related properties changed. Update the geometry.
    if (data.width !== oldData.width ||
        data.height !== oldData.height ||
        data.depth !== oldData.depth) {
        console.log("DIMENSION CHANGE DETECTED");
        recreate_walldoor(el, data);
    }

    // Material-related properties changed. Update the material.
    if (data.color !== oldData.color) {
      el.getObject3D('mesh').material.color = data.color;
    }
  }
});

Примерно так происходит изменение атрибута (это выглядит излишне запутанным, но это потому, что я смешиваю код из файлов, чтобы упростить рабочий процесс):

let div = document.createElement('a-entity');
var wall = document.createElement('a-entity');
wall.setAttribute('box-door', "");
wall.setAttribute('height', roomProps.h);
wall.setAttribute('width', roomProps.w);
wall.setAttribute('depth', roomProps.d);
wall.setAttribute('position', roomProps.center.clone().add(offset));
wall.setAttribute('rotation', {x:0, y:90.00 - theta*i, z:0});
wall.setAttribute('static-body', physics);
div.appendChild(wall);
ascene.appendChild(div);

1 Ответ

0 голосов
/ 18 июня 2020

Это потому, что вы обновляете атрибуты объекта, но не данные атрибута box-door.

Для этого вам понадобится что-то вроде:

wall.setAttribute("box-door", {width: roomProps.w, height: roomProps.h});
// or
wall.setAttribute("box-door", "depth: " + roomProps.d);

Затем он запустит функция обновления компонента "коробка-дверь". Как сказал D iego Маркос, было бы проще, если бы вы предоставили пример сбоя для запуска и редактирования :)

...