Блог

Я хочу создать компонент, который будет заполнен твитами.

Я создаю массив под названием «твиты», и я хотел бы получить доступ к массиву в return(). Я знаю о отображении, но есть ли способ просто отобразить его на странице? Я думал, что это будет похоже на {this.props.name } или просто {props.name } но это ничего не отображает на странице.

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

Tweets.js

 import React from 'react';

const Tweets = (props) => { 
    const tweets = [
        {name: 'Name 1',
        tweet:'This is a tweet!'},

        {name:'Name 2',
        tweet:'This is another tweet'},

        {name:'Name 3',
        tweet:'This is yet another tweet!'},
        ]

        return (
            <section>
                <h1>{this.props.name}</h1>
            </section>
        )
}


export default Tweets;
 

Ваши твиты находятся внутри самого компонента, они не поступают из props. Таким образом, вы можете получить доступ к одному значению с помощью чего-то вроде этого:

 {tweets[0].name}
 

Если вы хотите отобразить их все, вы можете сделать что-то вроде этого:

   return (
      <section>
        {
          tweets.map(({name, tweet}) => (
            <div>
              <h1>{name}</h1>
              <p>{tweet}</p>
            </div>
          ))
        }
          
      </section>
  )