Как использовать `||` для встроенных тестов в React? - PullRequest
Новая
       1

Как использовать `||` для встроенных тестов в React?

1 голос
/ 14 января 2020 

// dummy sources
const departments = [{ code: 'DA', title: 'Department A'},
  { code: 'DB', title: 'Department B'},
  { code: 'DC', title: 'Department C'},
  { code: 'DD', title: 'Department D'},
]

const reviewers = ['Department A', 'Department C', 'Department D']
const approvers = ['Department C']

const SFC = props => ( 
  <div>
  {
    departments.map(({ code, title }, i) => (
      <p className = "row" >
        {reviewers.indexOf(title) !== -1 && ( <span>reviewer_{code}</span> )}
        {approvers.indexOf(title) !== -1 && ( <span>approver_{code}</span> )}
      </p>))
  }
  </div>
)

// Render it
ReactDOM.render( <
  SFC / > ,
  document.getElementById("react")
)
.row {
  border: 1px solid black;
  padding: 1em ;
  margin: 1em ;
}

.row span {
  background: lightblue ;
  padding: 1em ;
  margin: 1em ;
}
<div id="react"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
https://stackoverflow.com/questions/ask#

Мне не нужно создавать пустую строку, в которой нет рецензентов или утверждающих. Я попробовал это: 

const SFC = props => ( 
  <div>
  {
    departments.map(({ code, title }, i) => (
      { reviewers.indexOf(title) !== -1 & || approvers.indexOf(title) !== -1 &&
        (
          <p className = "row" >
            {reviewers.indexOf(title) !== -1 && ( <span>reviewer_{code}</span> )}
            {approvers.indexOf(title) !== -1 && ( <span>approver_{code}</span> )}
          </p>
        )
      }
    ))
  }
  </div>
)

Я получаю ошибку с тестом reviewers.indexOf(title) !== -1 & || approvers.indexOf(title) !== -1 && <component />. Я тоже пробовал (reviewers.indexOf(title) !== -1 || approvers.indexOf(title) !== -1) && <component />, но безрезультатно. Есть идеи?

1 Ответ

3 голосов
/ 14 января 2020

Может быть опечатка, если это фактическая строка: 

{ reviewers.indexOf(title) !== -1 & || approvers.indexOf(title) !== -1 &&...

изменить на: 

{ (reviewers.indexOf(title) !== -1 || approvers.indexOf(title) !== -1) &&...

Просто удалите лишние & после первого !== -1 и посмотрите если он работает.

...