Полимер 2.0 не может получить ребенка от идентификатора - PullRequest
0 голосов
/ 24 мая 2018

Я немного новичок в Polymer, и у меня возникла проблема в последнее время.Я динамически создаю определенное количество экземпляров своего веб-компонента, и я хотел бы иметь возможность вызывать метод для этих экземпляров из моего родительского компонента, но я не могу понять, как это сделать, даже с ответамиЯ нашел в Интернете.

Вот мой родительский метод, где я пытаюсь вызвать метод children (e.detail.id совпадает с идентификатором конкретного экземпляра моих детей, к которому я пытаюсь связаться):

childObj: function(e) {
     var name = "selectObj"+e.detail.id;
     this.$.name.hello();
},

И мой базовый метод моего ребенка:

hello: function() {
     console.log("hello");
}

Идентификатор, который получает имя, существует хорошо, но все же я получаю эту ошибку

TypeError: Polymer.dom(...).querySelector(...) is null

Я также пытался заменить this.$.name.hello() на this.$$('#selectObj'+e.detail.id)но все равно я получаю ту же ошибку.

Вот как я создаю свои дочерние элементы:

newObj: function() {
            var dynamicSelect = document.createElement("pbd-object-select");
            dynamicSelect.num = this.nbObj;
            var newId = "selectObj" + this.nbObj;
            dynamicSelect.id = newId;  
            Polymer.dom(this.root).querySelector("#listeObjet").appendChild(dynamicSelect);
        },

1 Ответ

0 голосов
/ 24 мая 2018

Есть две проблемы, связанные с тем, как вы пытаетесь запросить этот элемент.Один из них заключается в следующем:

this.$.name.hello();

В основном вы ищете элемент с идентификатором «имя», а не элемент с идентификатором, равным тому, что у вас есть в переменной name.Что-то вроде:

this.$[name].hello();

может работать лучше в целом, но в вашем конкретном случае все равно будут некоторые проблемы.this.$ - это просто «ярлык» для легкого получения элементов по идентификатору, , но , это просто объект, в котором ссылки на элементы существуют и имеют идентификаторы, когда элемент подключен.Из-за этого он не работает с элементами, которые включены условно (например, в dom-if s) или которые генерируются динамически, как в вашем случае.

Вы можете просто использовать метод getElementByIdКак вы это делаете в vanilla JS, просто помните, что вы запрашиваете в своем элементе, а не в document.Так что это будет что-то вроде:

this.shadowRoot.getElementById("selectObj"+e.detail.id).hello()
...