HTMLCollection [] не определено
rowGetter = i => {
const row = this.state.estimateItemList[i];
const selectRevison = this.state.selectedEstimate.revision;
const rowLenght = this.state.estimateItemList.length;
const changeColor = document.getElementsByClassName('rd') as
HTMLCollectionOf<HTMLElement>;
if (row.revision > selectRevison) {
for (let x = 0; x < changeColor.length; x++) {
row.changeColor.style.backgroundColor = 'red';
// changeColor.style.backgroundColor = 'red'; //this is get error(Cannot read property 'style' of undefined)
}
return row;
}
}
Я хочу изменить цвет строки, когда выполняется условие row.revision > this.state.selectedEstimate.revision. Как можно предотвратить смену this.color. Однако я не получаю никаких ошибок, но цвет строки не меняется, и changeColor : HTMLCollection [] не получает никаких элементов. это всегда undefined. Как я могу решить эту проблему?
Без сопроводительного HTML мы не сможем вам помочь. Что-то мне подсказывает, что ваш селектор неправильный.
что ты имеешь в виду, братан с сопроводительным HTML? что мне добавить?
@PatrickEvans, пожалуйста, приведите мне небольшой пример. Я новичок в React
Что должен делать const changeColor = document.getElementsByClassName('rd') as HTMLCollectionOf<HTMLElement>? document.getElementsByClassName возвращает NodeList, так почему бы не использовать Array.from(document.getElementsByClassName...), а затем просто выполнить итерацию с использованием .forEach (или сопоставить с помощью .map), как любой другой массив?
@ Mike'Pomax'Kamermans благодарит тебя за ответ, братан. HTMLCollection уже является массивом? и, пожалуйста, дайте мне немного. для каждого примера. больше нет массива.
NodeList, HTMLCollection - это объекты, подобные массиву (не имеют ничего общего с реакцией). Это означает, что вы обращаетесь к ним как к массиву, то есть changeColor[x]
@PatrickEvans, что я могу сделать, братан изменить список массивов на массив объектов?
Это абсолютно не массивы. NodeList и HTMLCollection - это списки жить, что означает, что если ваш документ изменяется, они меняются вместе с ним. Таким образом, они могут измениться, пока вы их перебираете, который может сломать все, что угодно. Поэтому перед повторением вам нужно получить стабильный список, для которого вы используете Array.from(). Но с учетом всего сказанного: зачем вы вообще запрашиваете DOM? Если вы реагируете, ваша DOM - это результат вашего кода реакции, поэтому идея состоит в том, чтобы манипулировать / проверять все на стороне реакции.
@ Mike'Pomax'Kamermans спасибо за ваш ответ, братан, я использовал const changeColor = Array.from(document.getElementsByClassName("rd") as HTMLCollectionOf<HTMLElement>);, но все равно changeColor [] ничего не получил, он все еще пуст
Я бы по-прежнему рекомендовал «не получать доступ к DOM». Эта информация уже должна быть полностью доступна на стороне React. Также в качестве небольшого совета, более связанного с кодекс поведения: постарайтесь воздержаться от звонков людям братан. Приличное количество людей сочтут это оскорбительным (и на то есть веские причины, учитывая то, с чем это слово ассоциируется в североамериканской культуре).
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Не могли бы вы попробовать это:
const changeColor = document.getElementsByClassName ('rd');
вместо того :
const changeColor = document.getElementsByClassName ('rd') как HTMLCollectionOf;
[ts] Для универсального типа 'HTMLCollectionOf <T>' требуется 1 аргумент (ы) типа. я получаю эту ошибку
Убедитесь, что страница имеет имя класса "rd"
Вы неправильно обращаетесь к
changeColor, т.е. вы не используете ключ / индекс