• Как переписать это по нормальному???

    pash4paul
    @pash4paul
    Маппинг - это, дословно отображение. Т.е. ты берешь данные в одной форме и отображаешь их в другую форму.
    map - это функция, которая проходит по списку данных, берет каждый его элемент, применяет к нему какую-то функцию, которая возвращает новый элемент и возвращает новый список, состоящий уже из новых элементов, т.е. маппит (отображает) items в rows.

    Пример выше можно также переписать так.

    render() {
      const items = [
        'Клиент',
        'Год',
        'Период',
        'Версия',
        'Статус',
        'Режим',
        'Форма'
      ]
    
      function make_row(value) {
        return (
          <div className="descr-doc__item">{value}</div>
        )
      }
    
      const rows = items.map(make_row)
    
      return (
        <div className="descr-doc">
          {rows}
        </div>
      )
    }
  • Как переписать это по нормальному???

    pash4paul
    @pash4paul
    Сработает, в таком случаем items будет выглядеть так.

    const items = [
      `Клиент: ${client}`,
      `Год: ${year}`,
      `Период: ${period} квартал`,
      `Версия: ${version}`,
      `Статус: ${status}`,
      `Режим: ${mode}`,
      `Форма: ${type}`
    ]


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

    Т.е. данные хранятся в items, а rows это уже то как ты их выводишь. Представь это как конвеер - у тебя есть набор данных, которые ты mappишь в какое-то представление и это предоставление уже видит пользователь.
  • Как сформулировать вопрос, чтобы найти инфу об основах разработки приложений на js?

    pash4paul
    @pash4paul
    class App extends Component {
      constructor(props) {
        super(props);
    
        this.state = {
          users: [],
        };
      }
    
      componentDidMount() {
        fetch('https://myhost.com/users/get/')
          .then(response => response.json())
          .then(data => this.setState({ users: data.users }));
      }
      
      ...
    
    }


    Вот пример, который можно брать за основу.

    1) componentDidMount вызовется автоматически, кода компонент уже будет создан и с ним можно что-то делать.
    2) внутри метода componentDidMount происходит запрос к 'https://myhost.com/users/get/', который вернет данные в json формате.
    3) Конструкция .then(response => response.json()) получает на вход ответ (response), перегоняет его в JS-объект и кидает на вход следующему then.
    4) .then(data => this.setState({ users: data.users })) берет из JS-объекта поле users и помещает его в state.
    5) вызов this.setState обновляет state, затем вызывает render и компонент перерисовывается с полученными данными.

    Итого - внутри componentDidMount пишем код, который получит данные с сервера и поместит их в state. Дальше react все сделает сам.