Динамическая генерация нескольких условий внутри оператора Javascript if - PullRequest
Новая
       28

Динамическая генерация нескольких условий внутри оператора Javascript if

0 голосов
/ 03 марта 2019

Внутри функции .map () моего компонента React у меня есть оператор if, который должен содержать несколько условий, разделенных ||оператор.Проблема в том, что this.state.insights - это массив, состоящий из переменных длин в зависимости от данных json, которые извлекаются с моего сервера.

document.getElementById("adMaskid" + this.props.id).innerHTML = audio_data
    .map((sample, i) => {
        let rectOpacity = 1
        if (i > this.state.insights[0].start && i < this.state.insights[0].end || /
            i > this.state.insights[1].start && i < this.state.insights[1].end) {
            rectOpacity = 1;
        } else {
            rectOpacity = 0;
        };

        let sampleWidth = 100.0 / audio_data.length;
        let sampleHeight = sample * 50.0;

        return `<rect style="transform: scaleY(.9); opacity: ${rectOpacity};"
                x=${sampleWidth * i}
                y=${(25 - sampleHeight)}
                width=${sampleWidth}
                height=${sampleHeight} />`
    )}

Я в полном недоумении, как преодолеть это препятствие.Если, например, массив this.state.insights состоит из 3 значений, то как мне будет динамически создавать оператор if, отражающий то, что будет выглядеть следующим образом - 

if (i > this.state.insights[0].start && i < this.state.insights[0].end || /
    i > this.state.insights[1].start && i < this.state.insights[1].end ||
    i > this.state.insights[2].start && i < this.state.insights[2].end ||)

Без необходимости изменения группымой основной код, есть ли способ сделать это?Я читал об использовании операторов eval, но это заставило меня надеяться, что есть лучшее и более безопасное решение.Большое спасибо за понимание.Это чрезвычайно ценится.

1 Ответ

0 голосов
/ 03 марта 2019 
 this.state.insights.some(({ start, end }) => i > start && i < end )

Просто итерируйте массив insights, совсем не нужно eval.

...