#javascript #html #css #reactjs #ecmascript-6
#язык JavaScript #HTML #CSS #реагирует на #ecmascript-6
Вопрос:
Привет, у меня проблема, пожалуйста, помогите мне ее решить
Комментарии:
1. Пожалуйста, проясните вашу конкретную проблему или предоставьте дополнительные сведения, чтобы выделить именно то, что вам нужно. Поскольку это написано в настоящее время, трудно точно сказать, о чем вы просите.
Ответ №1:
Поскольку цвет вашего фона НЕ будет зависеть от информации о четном/нечетном индексе, вам следует просто использовать другой подход для оформления.
Что бы я лично сделал, так это использовал классы CSS для определения начальных четных/нечетных строк, а когда строка расширяется, предоставляйте ее дочерним элементам один и тот же класс.
Вы не поделились кодом «расширения», поэтому я действительно не знаю, как вы могли бы это сделать, но что-то в этом роде:
lt;tr key={i} className={`Itable-row-default table-row-${i} ${i%2 === 0 ? 'table-white' : 'table-grey'}` } gt; lt;td colspan={columnData.length 1}gt; {dataExpand[i]} lt;/tdgt; lt;/trgt; И соответствующий css
tr { amp;.table-gray { background: gray; } amp;.table-white { background: white; } }
В зависимости от метода «onExpandHandler» и формата вашей исходной модели, возможно, потребуется некоторая адаптация 🙂
(о, и вам следует отдать предпочтение скриншотам для изображений :p)
Комментарии:
1. Я обновил свой вопрос. Я пробовал код выше, но та же проблема возникает, когда я разворачиваю любую строку, учитывая, что она расширена как новая строка, и цвет всей таблицы меняется