Как я могу определить переменную в цикле рендеринга - PullRequest
0 голосов
/ 24 октября 2019
render() {
return (
<ul>
{scopeOptions.map((option, keyOption) => (
    let myVar = keyOptions * 5
    <li key={keyOption}>
        <a href="#" data-value={option.value}>{option.label}</a>
    </li>
))}
</ul>
)
}

Я хочу определить переменную myVar в цикле, но я не знаю, как это сделать, пожалуйста, помогите мне!

Ответы [ 2 ]

1 голос
/ 24 октября 2019

Вы используете функцию стрелки, создайте блок для определения переменной, чтобы написать несколько операторов внутри функции стрелки.

{scopeOptions.map((option, keyOption) => {
    let myVar = keyOption * 5
    return (<li key={keyOption}>
        <a href="#" data-value={option.value}>{option.label}</a>
    </li>)
})}

Чтобы узнать больше о функциях стрелки, обратитесь к здесь

1 голос
/ 24 октября 2019

Возвращать объект внутри карты вместо неявного возврата.

Не уверен Если я прав: -

1) keyOptions не определено, вы имели в виду keyOption

2) data-value="{option.value}", я думаю, что это должно быть без двойных кавычек

{scopeOptions.map((option, keyOption) => {
    let myVar = keyOption * 5
    return (
      <li key={keyOption}>
         <a href="#" data-value={option.value}>{option.label}</a>
      </li>
    )
})}

Рабочий код ниже для справки: -

import React from "react";
import ReactDOM from "react-dom";

import "./styles.css";

class App extends React.Component {
  render() {
    let scopeOptions = [
      {
        'value': '1',
        'label': 'label 1'
      },
      {
        'value': '2',
        'label': 'label 2'
      }
    ]
    return (
      <div className="App">
        <ul>
          {scopeOptions.map((option, keyOption) => {
            let myVar = keyOption * 5;
            return (
              <li key={keyOption}>
                <a href="#something" data-value={option.value}>
                  {option.label}
                </a>
              </li>
            );
          })}
        </ul>
      </div>
    );
  }
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

Надеюсь, что помогает !!!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...