Как console.log() эта функция?

Question

Я хотел бы сгенерировать JSX для React-Native, но я хочу изучить каждый ключ/значение с помощью console.log().

, что я после:

{Object.keys(this.state.types).map((obj) => (
      console.log(obj); <-- This guy 
      <Item label={obj[TYPE]} value={obj[ID]} /> 
     ))} 

Но ошибка брошена «Неожиданный маркер»

Как я могу еще отлаживать мои ценности в карте?

Answer 1

Вы можете использовать оператор запятой:

{Object.keys(this.state.types).map((obj) => (
     console.log(obj), <-- This guy 
     <Item label={obj[TYPE]} value={obj[ID]} /> 
    ))} 

который оценивает заявление, а затем отбрасывает его, или вы может использовать || оператор, который будет оценивать console.log, который возвращает false, а затем вернет Реагировать элемент:

{Object.keys(this.state.types).map((obj) => console.log(obj) || (

     <Item label={obj[TYPE]} value={obj[ID]} /> 
    ))} 

Однако, как справедливо Hacky, я рекомендую вам превратить вашу функцию стрелки в многострочного стрелки и просто использовать return:

На боковой ноте - не забудьте установить свойство key на объекты, возвращенные из массива, или вы получите снижение производительности и предупреждение (в настоящее время вы этого не делаете).

Answer 2

Круглые скобки в => ( указывают функции, что они возвращают объект (JSX передается в объект JS). Вы хотите, чтобы тело функции выполняло console.log(), а затем возвращало элемент <Item>.

Преобразовать круглые скобки, фигурные из них, а также добавить оператор возврата:

{Object.keys(this.state.types).map((obj) => { 
    console.log(obj); <-- This guy 
    return (
    <Item label={obj[TYPE]} value={obj[ID]} /> 
); 
})}