Все сервисы Хабра

Сообщество IT-специалистов

Ответы на любые вопросы об IT

Профессиональное развитие в IT

Удаленная работа для IT-специалистов

Войти на сайт
  • Все вопросы
  • Все теги
  • Пользователи

Хабр Q&A — вопросы и ответы для IT-специалистов

Получайте ответы на вопросы по любой теме из области IT от специалистов в этой теме.

Узнать больше
другие проекты хабра
  • Хабр
  • Карьера
  • Фриланс
Задать вопрос
TchernyavskD

Daniil

Formoshlep
  • 9
    вклад
  • 11
    вопросов
  • 12
    ответов
  • 50%
    решений
Лайки
  • Информация
  • Ответы
  • Вопросы
  • Комментарии
  • Подписки
  • Нравится
  • Какие есть варианты с NotFound Page в React Router?

    rockon404
    Антон Спирин @rockon404 Куратор тега React
    Frontend Developer
    Можно обрабатывать в асинхронном действии или в компоненте пользователя. Если сервер вернул вместо пользователя 404 и сообщение вроде 'ApiObjectNotFound', делаете редирект на страницу NotFound.

    Не забудьте сделать список зарезервированных слов, которые нельзя будет использовать для slug пользователя.
    Ответ написан более трёх лет назад
    Комментировать
    Комментировать
  • Как передавать данные пользователя из хранилища в React + React Router?

    maxfarseer
    Максим @maxfarseer
    https://maxpfrontend.ru, обучаю реакту и компании
    (если react-router версии 4)
    У вас в this.props.match.params.user будет то, что человек вбил после / для роута:
    <Route path="/:user" component={Profile} />

    Следовательно, в componentDidMount комопонента Profile если нужно "эмулировать" загрузку данных, через setTiemout или просто прямо в render компонента, вы можете этим ( this.props.match.params.user ) значением пользоваться и все.

    Как вы будете доставать объект юзера из массива с данными, дело ваше. Можно поиском по массиву, можно сделать метод в том же файле и его экспортировать, например:

    export function findUserById(id) => {
      // ищем по id элемент в массиве и возвращаем его
    }
    Ответ написан более трёх лет назад
    2 комментария
    2 комментария
  • Как в React Router адекватно решить мою проблему?

    rockon404
    Антон Спирин @rockon404 Куратор тега React
    Frontend Developer
    Примерно так:
    <Switch>
      <Route path="/:user_slug" component={Profile} />
      {me && <Redirect exact from="/" to={'/' + me.slug} />}
    </Switch>

    me - это ваш авторизованный пользователь. Если пользователь авторизован, то me существует и с корневого пути выполняется редирект на его страницу.
    Ответ написан более трёх лет назад
    Комментировать
    Комментировать
  • React Router в Twitter, как они реализовали?

    rockon404
    Антон Спирин @rockon404 Куратор тега React
    Frontend Developer
    Для решения задачи можно использовать свойство isActive.
    Демо.
    Ответ написан более трёх лет назад
    1 комментарий
    1 комментарий
  • Передача компоненту props или state + map, REACT?

    rockon404
    Антон Спирин @rockon404 Куратор тега React
    Frontend Developer
    В случае с навигацией, передаете массив элементов в props и рендерите с помощью метода map.
    Не забудьте передать каждому элементу свойство key.
    Ответ написан более трёх лет назад
    Комментировать
    Комментировать
  • Как при поиске изменить цвет у части слова?

    davidnum95 @davidnum95
    Вот по правильному
    Ответ написан более трёх лет назад
    2 комментария
    2 комментария
  • Как при поиске изменить цвет у части слова?

    0xD34F
    0xD34F @0xD34F Куратор тега React
    Так?
    Ответ написан более трёх лет назад
    1 комментарий
    1 комментарий
  • Как поменять местами данные у компонентов React?

    0xD34F
    0xD34F @0xD34F Куратор тега React
    const Input = ({ label, ...props }) => (
      <div>
        <label>
          {label}
          <input {...props} />
        </label>
      </div>
    );
    
    class App extends React.Component {
      state = {
        from: 'Москва',
        to: 'Питер',
      }
    
      onChange = ({ target: { value, name } }) => {
        this.setState(() => ({
          [name]: value,
        }));
      }
    
      swap = () => {
        this.setState(({ from, to }) => ({
          from: to,
          to: from,
        }));
      }
    
      render() {
        return (
          <div>
            <button onClick={this.swap}>swap</button>
            <Input label="откуда" value={this.state.from} name="from" onChange={this.onChange} />
            <Input label="куда" value={this.state.to} name="to" onChange={this.onChange} />
          </div>
        );
      }
    }
    Ответ написан более трёх лет назад
    1 комментарий
    1 комментарий
Оценили как «Нравится»
Самые активные сегодня
  • Rsa97
    Rsa97
    • 6 ответов
    • 0 вопросов
  • Антон Банников
    • 5 ответов
    • 0 вопросов
  • pindschik
    pindschik
    • 4 ответа
    • 0 вопросов
  • AshBlade
    Сергей Соловьев
    • 4 ответа
    • 0 вопросов
  • Mike_Ro
    Михаил Р.
    • 4 ответа
    • 0 вопросов
  • mayton2019
    • 4 ответа
    • 0 вопросов
  • © Habr
  • О сервисе
  • Правила
  • Обратная связь
  • Блог

Войдите на сайт

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