Форум программистов и сисадминов Киберфорум

Темы раздела React/ReactJS

Three.js - переключение между 2 камерами-3d это перспективная и 2d ортографическая
Здравствуйте.Работаю на реакте в 3d библиотекой THREE-JS.Задача-ставить цилиндр по клику мышкой на пол(изначально строится помещение).Происходит переключение между 2 камерами-3d это перспективная и...

Создать posts по кнопке "submit"
Всем привет, не как не могу разобрать с posts в ReactJS Нужно по кнопке "Add posts" каждый раз добавлять новый пост. т. е постов должно быть несколько. вел текст нажал на кнопку первый пост, ввел...

Ошибка webpack с использованием eslint
Здравствуйте. Возможно что-то не так делаю или понимаю. Пытаюсь настроить eslint в проекте React + TypeScript. У меня вроде eslint работает корректно. То есть ищет ошибки, Знает про...

React+Vite, ошибка Uncaught SyntaxError: Unexpected token '<'
Всем здравствуйте.Делаю проект на реакте и для меню создал вот такой словарь export const privateRoutes = { "Методики": , "3D": , "Справочник РТП": , "СТП-2.0": , ...

Вызвать из компонента1 другой компонент2. Уловный рендеринг и состояния
Господа, добрый вечер. Что-то я совсем запутался. У меня есть множество компонентов(это маркеры на карте), по контекстному клику которых я вызываю диалог для каждого компонента свой и передаю данные...

Книги по React "для продвинутых"
Всем привет. С 2015 года работаю фуллстеком (прерываясь на чистый бэк). Использовал многие библиотеки и фреймворки. Сейчас работаю с Реактом. Я легко справляюсь с текущими задачами, но у меня грейд...

Uncaught (in promise) TypeError
По нажатию на кнопку срабатывает событие авторизации пользователя. async function getUserInfo(nomcard) { await MainApi.getUserInfo(nomcard) .then((res) => { if (res.status...

Компонент с запросом данных по интервалу не выполняет запрос при первом рендере
Добрый день, господа! ОПИСАНИЕ ПРОБЛЕМЫ: У меня есть простой компонент с запросом данных по интервалу в useEffect без зависимостей. Идея в том, что при первом рендере устанавливается интервал, по...

CellInput - инпут из ячеек
Всем привет. Сделал компонент - инпут, состоящий из ячеек. Хотелось бы увидеть обоснованную критику кода и альтернативные, более простые и правильные пути. Заранее спасибо. Главный компонент Cell...

Наследование функционального компонента
Здравствуйте дорогие ребята. Мне в react очень не хватает наследования... искала разные примеры и статьи в интернете, но предлагают везде композицию вместо наследования. Наверное я так не научилась...

TypeError: Cannot destructure property 'error' of 'undefined' as it is undefined
Привет! Есть следующая ошибка: TypeError: Cannot destructure property 'error' of 'undefined' as it is undefined. Не подскажите где она может быть или в чём заключается? Спасибо!

Пустые угловые скобки в React
Привет. Разбираюсь с React-ом. Пока использую обычный JavaScript. Из элементов React сделаны компоненты. Компоненты возвращают (return) элементы React. Написал несколько простых функциональных...

Чат с ИИ
Приветствую, уважаемые программисты! Делал тестовое в одну фирму, но запаздал со сроками из-за здоровья, попал в больницу, вакансию закрыли. Все равно решил доделать, т.к. тестовое было интересным....

Код после ИИ
Добрый день! Может пишу и не туда, но в коде есть слово "react" потому решил начать отсюда! Если не прав - поправьте меня пожалуйста. И так, решил сгенерить код с помощью ИИ - многие так...

Неверно сохраняется статья
Доброе время суток, пишу программу Блог (набор статей). При сохранении статьи появляется следующая информация (выделено жирным шрифтом): <p class="text-justify" style="margin: 0px 0px 10px; color:...

Использование круглых скобок при создании Компонентов
Привет :) . Почитал, как создавать компоненты: можно использовать функцию (обычную или стрелочную), либо класс. Для примера буду использовать обычную функцию. В одном примере видел примерно такой...

Не удается переопределить интерфейс ThemeOptions библиотеки MaterialUI
Всем привет. Есть приложение на React + Typescript + MaterialUI Пытаюсь добавить в тему MaterialUI свои поля. Почему-то не работает переопределение интерфейса ThemeOptions. При попытке передать в...

React: Встроенные условия if с логическим оператором &&
Привет. Изучаю React. Нашёл такой пример: Пример 1: ... в JavaScript-выражение true && expression всегда вычисляется как expression, а выражение false && expression — как false. То есть, если...

Можно ли передать в React - хук другой хук и там им пользоваться?
Вопрос в том, что я хочу сделать универсальный хук который будет получать данные для сущности либо по хуку GetEntity, либо получать по особенному иницилизированный объект для добавления по хуку...

Работа иконок-ссылок по нажатию
Доброе время суток! ................ const ControlPanelContainer = ({ className }) => { const navigate = useNavigate(); return ( <div className={className}> <RightAligned>...

Отрисовка графа в динамическом canvas
Доброго времени суток :) Имеется вот такой компонент для отрисовки и работы с генерируемой анимацией(следующий шаг, заново и прочее). Канвас динамически изменяет размер в зависимости от устройства....

DevExtreme DataGrid не перерисовывается при установке состояния
Всем привет. Столкнулся со странным поведением DevExtreme React. Вставляю простейший компонент таблицы с dataSource и columns Колонки рисуются корректно, но значения в dataSource не подставляются -...

Expo React Native Ad Rewarded
Помогите, пожалуйста. Не знаю что правильно нужно использовать для добавления рекламы, которая даёт награду за просмотр в expo приложение. GPT постоянно даёт противоречивые предложения. Нужен самый...

Задания на собеседование
Добрый день ребята. Меня попросили поучавствовать в собеседовании фронтенд-разработчика под react и подготовить несколько заданий. Я надеюсь вы не посчитаете не правильным, что я прибегла к форуру,...

Некорректный resolve модуля в Vite
Всем привет. Имеется приложение на vite+react+typescript. Заметил непонятное поведение при импортах. Если происходит импорт модулей, имеющих в папках одного предка, то Quick Fix VsCode предлагает...

Ошибка then(.)
Доброе время суток! ..................... const imageRef = useRef(null); const titleRef = useRef(null); const contentRef = useRef(null); const dispatch = useDispatch(); const navigate =...

Ошибка: 'add' is assigned a value but never used
Доброе время суток! import {useState} from 'react'; import TodoAdd from './TodoAdd.js'; import initialTodos from './todos.js'; export default function App() { const =...

Не появляется имя пользователя
Доброе время суток! В моем проекте, захожу под определенным пользователем, пишу комментарий к статье и нажимаю кн. Добавить. Всё добавляется кроме имени пользователя, при перезагрузке страницы...

Библиотеки React
Коллеги. Просьба подсказать такие "рыбные" места как "Ресурсы React с UI-компонентами". Т.е. готовые решения и библиотеки. В идеале с примерами использования. Вопрос о нежелании изобретать велосипед...

JsxRuntime для отображения реакт компонента в обычной html
Здравствуйте. Есть модуль iefe кастомной компоненты, принимает jsxRuntime, glMatrix, React. В инете есть примеры подключения модулей по ссылке через скрипты для React и ReactDOM. glMatrix есть...

--legacy-peer-deps удаляет react
Здравствуйте. Создается пакет с помощью rollup. Предупреждений при сборке никаких, т.е. работает. Захотел вставить css файл. Установил пакет npm install -D rollup-plugin-styles --legacy-peer-deps...

Material UI - скрыть spacing вместе с элементом DataGrid
Всем привет. Имеется условный DataGrid из 4 элементов (2x2). Необходимо скрыть нижний правый элемент (в примере - желтый), а верхний правый (красный) растянуть по вертикали на 100%. Но, т.к. проп...

Трекинг 3д модели
всем привет, столкнулся с проблемой, не получается настроить трекинг головы, использую mediapipe и 3д модель, устанавливаю маркеры на 3д модели, относительно точек mediapipe с помощью кода const...

Ошибка в App.js
Доброе время суток! import React from 'react'; import './styles/App.css'; import { BrowserRouter, Route } from 'react-router-dom'; import { About } from './pages/About'; import { Posts } from...

Переадресация в Routes
Доброе время суток! Так всё работает, export const privateRoutes = ; export const publicRoutes = ; return ( isAuth

Передача переменных окружения в React на этапе npm build
Доброго времени, недавно столкнулся со следующей ситуацией. Паковал React в Docker по иснтрукции, в React есть несколько системных перменных которые планировалось туда брать с .env файла. Однако,...

Контроль доступа на основе ролей
Пет проект на локальном компе. На бэкенде dotnet Web API, на фронте ReactTS. Авторизация на основе JWT, данные хранятся в localStorage. Юзеры распределены по нескольким ролям. Вопрос: Как...

Не читается значение свойства из стора MobX при наследовании сторов
Всем привет. Пытаюсь реализовать наследование в сторе MobX. Столкнулся со странным поведением при попытке задать значение свойству isLoading. В сеттере свойства нормально проходит установка В...

Как с typescript перевести на jsx следующий код
loginForm.tsx import React, {FC, useContext, useState} from 'react'; import {Context} from "../index"; import {observer} from "mobx-react-lite"; const LoginForm: FC = () => { const =...

Автоматическое перенаправление в стандартный браузер из Телеграмного
Всем привет! Кто-нибудь может подсказать способ как детектить на мобильных устройствах (IOS и андроид), что сайт открыт в браузере Телеграма, и в таком случае выполнить автоматическое открытие сайта...

Как получить данные из парсера
Всем доброго времени суток! Есть такая задача - сделать парсер сайта с вакансиями. Страница парсится нормально на php, но контакты как-то подгружаются без перезагрузки страницы ajax-ом....

Проблема со слайдером react slick
Добрый день. Помогите, пожалуйста решить проблему. Пытаюсь сделать слайдер с использованием react-slick. На десктопной версии все работает норм, но как только перехожу на меньший размер...

Ошибка с ссылками на функции
Вот ошибка: ./src/components/modals/CreateBrand.js Attempted import error: 'createBrand' is not exported from '../../services/DeviceService'. вот CreateBrand.js он находится...

Можно ли сделать 2D PvP файтинг на expecting node.js myself?
Позволяет ли скорость myself сделать 2д пвп файтинг наreact node jwt если нет то как насчёт mongodb(просто пока я им не владею)

Как запустить проверку typescript типов без выделения дополнительной памяти?
Столкнулся с следующей проблемой, после обновления версии ant design c "antd": "5.15.0" на "antd": "6.2.2", возникает проблема с проверками типов, не хватает стандартного выделения памяти 4144 MB,...

Stimulsoft - после активации лицензии из Viewer отчета не убирается водяной знак Trial
Всем привет. Подскажите плз, кто сталкивался. Имеется лицензионный ключ StimulSoft Устанавливаю в приложении React, согласно документации: Stimulsoft.Base.StiLicense.Key = "ключ" С...

Почему при обновлении страницы пропадает авторизация
http/index.js import axios from 'axios'; export const API_URL = `http://localhost:5000/api` const $api = axios.create({ withCredentials: true, baseURL: API_URL })

Как можно вместо массива использовать API json в виде внешнего файла?
Господа! Я пока не много знаю библиотеку React. Подскажите, как можно вместо массива использовать API json в виде внешнего файла? Вот исходник моего файла import React from 'react'; //import {...

Отображение картинок на странице
Вопрос избитый, неоднократно обсуждаем, с кучей решений и тд.. Но! Проблема. Не отображаются картинки в проекте. Реакт, компонент jsx. путь компонента: /src/components/post/post.jsx Пробовал...

Как запустить чужой проект?
Добрый день ... хотел скачать и запустить чужой проект, чтобы рассмотреть его функции... но столкнулся с рядом проблем ... что он не изволяет запускаться , и просто не знаю что делать, помогите...

Получение значение PromiseResult для объекта Promise
Здравствуйте, уважаемые форумчане! Выполняю запрос к PHP-скипту внутри конструктора классовой компоненты с помощью axios: class UniverseScrollTest extends Component { //Описываем компоненту...

Cannot read properties of undefined (reading 'map')
Нужна ваша помощь. Пробую собирать данные API с помощью redux. Когда хочу отрисовывать данные то получаю эту ошибку: Cannot read properties of undefined (reading 'map') Что я делаю не так? Спасибо...

React.js подключение внешнего js файла
Здравствуйте. Только что начал изучать React и дошло до того, что мой js файл не подгружает компоненты на страницу. Если этот же код поместить в <script> в html-е, то все работает. Библиотеки...

Вызов метода при загрузке страницы
Добрый вечер, пытаюсь прикрутить API и выводить данные. Хочу получать данные при загрузке страницы, ну пока удалось только сделать при клике на кнопку. Как можно реализовать? class App extends...

Маска для введения номера телефона (react-input-mask)
Проблема такая, существует большой компонент (InputMask из react-input-mask), у которого нежелательно менять onChange в него улетает маска вида phone: '+7 (999) 999-99-99', нужно сделать просто...

react/ react hook с Rxjs
Здравствуйте. Столкнулся с проблемой изучения библиотеки RxJs. У меня есть ТЗ, создать секундомер. Но проблема в том, что не могу разобраться как правильно использовать эту библиотеку с react hook....

Обработчик события на клавишу Enter
Доброго всем времени суток! Нужно было повесить обработчик события на нажатие клавиши Enter. Походу дела я столкнулся с проблемой: элемент на который я вешал обработчик события на момент создания ещё...

Повесить событие на кнопку
Привет всем. помогите решить задачу, App одностраничный . На странице должны отображаться данные из базы, возможность добавлять новые данные, удалять, редактировать. Данные вытягиваю с помощью...

Как сделать редактирование данных в самой таблице React
Привет народ, очень нужна ваша помощь, сделал небольшое приложение Crud работающее с базой данных, вот есть проблемка, нужно сделать так чтобы редактировать данные можно было в самой таблице. На...

Проверка аутентификации на react
Здраствуйте! помогите пожалуйста, как сделать проверку аутентификации, и если пользователь залогинился то перейти на страницу home, у меня что то нчего не получается, не пойму как это делать(((( вот...

Не запускается локальный сервер
Прохожу книгу React in Action, скачал репозиторий автора з 4 главы? вставил в корне диска C "https://github.com/react-in-action/letters-social/tree/chapter-4" пробую запустить его с консоли в...

TypeError: state is not iterable
Доброго времени суток! Подскажите, почему появляется такая ошибка? Это редьюсер: export let initialCostsState = { costs: , isActive: 200 } export const costsReducer = (state =...

React (Balel) Какая разница в .js и .jsx
Вопрос в заголовке. Я раньше почему-то думал что .jsx файлы это спецификация файлов для компилятора babel, но тут на меня нашло озарение - бабелю же всё равно какие файлы компилировать и то есть...

Не собирается приложение - ошибка в файле index.tsx
Всем привет. Пытаюсь собрать приложение React webpack-ом, но выдает ошибку: ERROR in ./src/index.tsx Module build failed (from ./node_modules/ts-loader/index.js): Error: TypeScript emitted no...

JS React вывод массива списком
В чем косяк? <script type="text/babel"> const name = ; class Test extends React.Component { constructor(props) { super(props); const name = this.props.name; const list =...

Изменить значение в state массива
https://cdn1.savepice.ru/uploads/2018/11/16/32853a356a2a033bd8e914fe060f8157-full.png По нажанию на лайк, должен измениться цвет и увеличится кол-во на +1. Повторное нажание -1. Компанент для...

Как подключить картинку?
Пытаюсь подключить картинку в свой проект. Он её выводит, но пишет что не может найти такой модуль в самом vs code. Как я понял это проблема самого редактора, он неправильно видит рутовскую...

Почему такая ошибка "TypeError: Cannot read property 'bind' of undefined"?
import React from 'react'; import ReactDOM from 'react-dom'; class Todo extends React.Component{ constructor(props){ super(props) this.state = { name: ' TODO ', ...

Работа с iconv-lite (проблемы с кодировкой)
Всем привет. Суть задания такова Написать приложение для выполнения под ОС Android, которое переводит текст в одной кодировке (например win-1251) и записывает содержимое в другой кодировке...

Отменить обновление страницы при выполнении метода
У меня есть кнопка <form onSubmit={this.props.weatherMethod}> <input type="text" name="city" placeholder="Город"/> <button>Отобразить данные</button> ...

React js - рендеринг тормозит
У меня есть 2 компонента Первый это таблица на основе fixed-data-table-2,(около 100 строк, будет больше) при клике на ячейку таблицы хочу показать модальное окно. В браузере вижу предупреждение **...

Инструмент для парсинга сайта (nodejs + reactjs)
Нужен совет. Начал недавно изучать js + reactjs. Делаю первый сайт в целях обучения. Использую: nodejs, react(material ui, DevExtreme grid), npm. Идея следующая: 1. Парсить данные с...

После установки ReactJS появляется белый экран, вместо заставки
Здравствуйте, уважаемые форумчане! Пытаемся переносить проект на ReactJS, но пока, к сожалению, ничего не получается. Вместо заставки в <div id="root"></div> ничего не загружается. Да еще, ошибки...

Почему не работают ссылки React на хостинге?
Написал заметочник на React. Заметочник состоит из нескольких страниц. Для навигации использовал react-router. Локально работает все замечательно. Но после того как сделал react build и выложил на...

Недостатки React
Здравствуйте. Расскажите пожалуйста о недостатках, архитектурный просчетах, неудобствах и т.д. с которыми вы сталкивались при написании приложений с использованием React. В рунете (да и не только)...

Uncaught SyntaxError: Unexpected token '<'. Что делать ?
Была проблема с импортом, решил обойти через константы ибо даже с "type:module" не видел модуля. Тут появилась другая проблема, начал ругаться в сторону рендера, а конкретно в строке: contents=...

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

Cannot add property currentTime, object is not extensible
Здравствуйте! Проблемка в следующем ..... В компоненте есть элемент <audio> обращение к нему сделано через ref let audioRef = React.createRef(); return( <div> <audio ref={audioRef} ...

Настройка proxy в package.json
Здравствуйте. Создал две папки с проектами creat-react-app и laravel. Для тестирования использую Open Server. Для полной картины распишу: /OSPanel/domains/laravel /OSPanel/domains/react ...

Не могу понять почему "Unresolved function or method map()"?
Здравствуйте, не могу понять почему "Unresolved function or method map()"? Всё четко компилируется, но у WebStorm пишет предупреждение(ст 31) "Unresolved function or method map()". Подскажите...

Удаление элментов из DOM модели
Добрый день, как удаляют элементы из DOM модели на React? На Jquery мы находили элемент по селекторам и удаляли. А здесь как это работает?

React на хостинге
Пытаюсь установить react на хостинг beget, как тест и получаю, ошибку с import, webpack и babel установлены, настройки по node на beget выдержаны, облазил весь stackoverflow за решением, поддержка...

Как извлечь html из react?
Всем привет! :) Я хочу сделать так, чтобы реакт компилировал html, чтобы полученный html можно было использовать в проекте. Конечно можно найти содержимое контейнера root в браузере, но не хочется...

Можно ли учить react не зная JS?
Можно ли учить react не зная JS?

Почему не удаётся запустить проект?
Помогите мне пожалуйста. Пытаюсь запустить проект, разобраться с реактом. Читаю в файле package.json "build": "webpack -p --config webpack.production.config.js --progress --profile --colors",...

Пропадают элементы после перезагрузки страницы
У меня есть код, который создает мне список моих задач. Код является работающий. После того, как я создаю задачи, выполняю перезагрузку страницы то все мои созданные задачи пропадают.У меня есть 2...

Как задать плавный toggle в ReactJS?
Здраствуйте! помогите кто знает как в react задается скорость открытия блока? Сейчас у меня блок открывается слишкрм быстро constructor() { super(); this.state = { ...

React форма авторизации
Предпринемаю очередную попытку глубже войти в фонтент задача такая сделать форму авторизации(логин). Создал проект create-react-app создал компонентю нарисовать формачку не сложно(можно любой...

При хранении объекта в Redux, как хранить состояние полей редактирования (input)?
Есть некоторый список, который хранится в redux, например такой: { 1: { name: 'Саша', }, 2: { name: 'Маша', }, 3: { name: 'Наташа',

Создание и скачивание файла по нажатию на кнопку
Добрый день, Я новичок в js и react. Пытаюсь разобраться в следующем. С бэка на фронт приходит строка. Я хочу, чтобы при нажатии на кнопку создавался файл txt с этой строкой и начиналось его...

Запретить пробелы в input
День добрый! Помогите решить проблемку. Есть input добавления тегов и кнопка чтобы их добавить. Нужно чтобы в инпуте было запрещено вводить пробел. Заранее спасибо)! формы написаны через...

Does not contain a default export
Получаю вот такую ошибку ./src/components/Profile/MyPosts/MyPostContainer.jsx Attempted import error: '../../../StoreContext' does not contain a default export (imported as 'StoreContext'). при...

Ошибка [nodemon] app crashed - waiting for file changes before starting
Не подгружаются посты, а также почти сразу выбивает ошибку TypeError: Failed to fetch в браузере репозиторий проекта https://github.com/react-in-action/letters-social/tree/chapter-4 ничего в...

i18next способы смены языка
Я сделал два хелпера для создания компонента с переводом слова, всё работает. import moment from "moment"; import i18next from 'i18next'; import {Translation} from 'react-i18next'; import...

Удаление элемента по его id
Добрый день! У меня есть небольшой список, состоящий из отдельных компонент. Мне нужно сделать так, чтобы элемент по которому кликнут сначала выделялся(можно и без этого), а потом и удалялся кнопкой...

Вывод данных полученных в axios
Всем привет! Я изучаю reaсt и решил сделать попробовать получить данные с сервера. Я написал такой код: export default class PersonList extends React.Component { state = { post: ...

Как обратиться к массиву, который в массиве? React
Всем привет, подскажите как можно обратиться к массиву, который в массиве? Вот мой код: import React, { Component } from 'react'; import './App.css'; class App extends Component { constructor()...

Многостраничный ReactJS
Всем привет) изучаю реакт и вот вопрос. С компонентами разобрался, как работает пропс тоже. Вот теперь вопрос: Есть какое - то меню например: Работники и Отчет. В работники мы вносим наши...

Изменение цвета параграфа
Добрый день! вот задача: Параграфу реализовать выбор цвета. Можно выбирать из всего спектра (<input type="color" />) или использовать только 5-7 ваших любимых цветов (как в Google Keep). class App...

Преобразование JSON в массив объектов JS
Всем привет. Помогите, пожалуйста, разобраться с проблемой, так как в голове полная каша и я уже не знаю как мне с этим справиться. Есть локальный сервер, который я создал, чтобы протестить запросы...

Ошибка "Failed to compile"
При попытке перебросить const gameSettings в компонент < Game /> вылазит ошибка "Failed to compile ./src/app.js Line 38:27: 'gameSettings' is not defined no-undef Search for the keywords to...

Нужна критика кода переключателя темы на React
Здравствуйте, нужна критика кода переключателя темы. Что сделано не так, что улучшить? Принимаю любую критику. gitHub:...

Как сделать анимацию переключения картинки
Доброго времени суток! Я только учусь и поэтому прошу сильно не ругать за возможные глупости! :) Делаю учебный проект интернет магазина на React.js + Redux, так вот сделал я компонент по типу...

Input type search, событие по кноке очистить
Доброго времени суток. Ребят подскажите с вопросом, компонент в котором есть input с типом search. Как обработать событие очистки поля по нажатию на "крестик". Заранее спасибо большое.

React_js ошибка error:0308010C:digital envelope routines::unsupported
как сделать чтобы реакт заработал? в консоли браузера такая ошыбка - crbug/1173575, non-JS module files deprecated. работаю в vs code на macos ...

Как вывести запрашиваемые данные из JSON (Reactjs api call)?
Доброго времени суток. Начал изучение API call на ReactJs. Данные из JSON вывел , без каких либо проблем, но вот теперь хочу сделать вывод данных по запросу который вводят в Input. И не совсем...

Рендер списка объектов карточками
Я новичок и некоторые задачи ставят меня пока в тупик. Есть API с массивом карточек товаров Нужно написать App, который будет рендерить список объектов карточками.

ReactJS: render таблицы
Скажите, плз, как отрендерить пустую таблицу (напрмиер 4 колонки и 4 столбца) в ReactJS через массив?

Render массива объектов
Доброго времени суток! :) Подскажите, пожалуйста, чего бы React мог ругаться на подобную форму отображения массива с объектами? getBlockMarkup = (blocks) => { const Block = ({data}) => ( ...

React. Список пользователей
https://jsonplaceholder.typicode.com/users Нужны столбцы таблицы:id,name,email. Я новичок в React.

Всплывающее окно на определенной кнопке
Приветствую формучане, я еще новичок в JavaScript с React и пока не совсем понимаю как решать данную проблему. У меня есть определенный список который отображается методом map из сервера на 56...

Как в React в onclick вызвать функцию из другого файла
Допустим у меня есть файл heder.js import React, { Component } from 'react'; import './header.css'; class Header extends Component{ signIn = () => { alert('clicked'); }

Фильтр строк по любым буквам React.js
всем привет. есть такое вопрос. даны любые слова (строки). Компоненту в props передаётся массив строк. Он отображает их в виде вертикального прокручивающегося списка. Есть инпут. При вводе текста в...

Динамическое меню
Здравтсвуйте! Использую React + redux и не могу понять, как правильно организовать динамическое меню. В хедере навигация и при нажатии на одну из ссылок, загружается 2 столбца - контент и меню....

React и clearInterval
Добрый день! <div onClick={this.start.bind(this)}>старт</div> <div onClick={this.stop.bind(this)}>стоп</div> Две кнопки, (код упрощен) timer() { const...

Store не хранит состояние
Здравствуйте! Создал store с помощью hook'ов: /*code...*/ import { InsuranceItemContext } from './Context/InsuranceItemContext'; import { reducer } from './Reducer/Reducer'; function...

LocalStorage для корзины товаров (React/Redux)
Привет! Стоит задача, чтобы после перезагрузки данные корзины покупок оставались. Я пытаюсь это прикрутить через LocalStoge и Redux. Прошу помочь. Я совсем не понимаю иду ли я в правильном...

Нет подключения к firebase
Создаю react приложение. Нужна бд firebase. Настроила, но при запуске ошибка: высвечивается сообщение, что подключение не доступно('Error loading the Firebase SDK, check the console.'), затем...

ReactJs изменение цвета после ввода названия цвета
Здравствуйте, извиняюсь, что написал возможно, не самый понятный заголовок, но мне не пришло в голову более подходящее название. Начал учить Reactjs и застрял перед вроде очевидной, но мною не...

Ошибка масштабируемости карты Leaflet на React
Товарищ, хочу поведать о своей проблеме Решил я значит сделать карту на Leaflet и React, а она и не работает, точнее криво-косо. Для начала просто вставил пример с офф сайта.(Первая картинка) ...

Срендерить строку с html
Как срендерить строку с html? render() { var title = '<b>Строка</b>'; return ( <div> {title} </div> )

Автоматическое нажатие на кнопку через 10 секунд
Добрый день. Есть следующая проблема. Нужно как-то совместить setTimeout и onClick на React JS. Хочется сделать автоматическое нажатие на кнопку через несколько секунд. Рабочий код (нажатие вручную...

Как выполнить AJAX-запрос в React?
Я хочу получить данный с сервера и сохранить их в state. class NavBar extends React.Component { constructor(props) { super(props); this.state = { navs: {}, ...

Как отключить событие фокуса у дочернего элемента?
Как отключить событие фокуса у дочернего элемента? В коде ниже работает получение фокуса у родительского div и когда он теряется, однако проблема в том, что при клике на дочерний элемент этого div...

Вынос fetch "post" запроса в отдельный файл
Здравствуйте, подскажите пожалуйста можно ли вынести "post" запрос в отдельный файл? Я сделал папку с файлом "api.js" и вынес туда "get" запросы, хотел бы узнать как можно вынести и "post" запросы...

Можно ли сделать соц сеть на javascript, react.js, ajax, mysql?
можно ли сделать соц сеть на javascript, react.js, ajax, mysql?

Не устанавливается флажок checked (radio button) в onChange не меняется при нажатии на радио кнопку
Здравствуйте, я в React JS новый, хотел бы кое что уточнить Код есть, в базе данных все корректно меняется при нажатии на кнопку. Проблема лишь в том, что оно не check-ается по внешнему виду(на...

Как экранировать кавычки для строки перевода из i18next?
В перевоед попробывал так. errorFileAvatar: "Ошибка файла \"Аватар\": ", При рендере export default function T(props) { return ( <Translation> {

ReactJS. Webpack. Как проверить версию браузера до подключения библиотек к проекту?
Всем привет!! Собираю проект Web Psck-ом, подключаю модуль React. На низких версиях типа Opera 18 получаю ошибку: Uncaught ReferenceError: Map is not defined ...

Можно ли создать сайт полностью на реакте?
Можно ли создать сайт полностью на реакте? То бишь весь htlml чтоб на нём был, и head и body? Пока дак пробывал в бади менять и сервис http://tools.neilpatel.com html не видит, но если в index.php ...

Как вывести двойной ассоциативный массив в react
echo json_encode( array( 'English' => , 'French' => ) ); render() { const { error, isLoaded, items } = this.state; ...

Не работает "React.lazy"
Здравствуйте, не работает "React.lazy", помогите пожалуйста что у мне не так с кодом. index.jsx import React, {Suspense} from "react"; import ReactDOM from "react-dom"; //Components //...

Редактор текста
Как переделать такой код под использование textarea вместо input? При попытке заменить input на textarea текст перестал редактироваться при потере фокуса var TextEditComponent =...

Callback с аргументами
В react приложении есть метод render() render( return( <div className="msu"> {listData.slice(0, 5).map(i => { switch(i) { case 0: ...

Как правильно удалить элемент по таймеру
if (props.error) { cls.push('fadeIn', 'modalShow') setTimeout(cls.splice(-2), 3000) } Пытаюсь сделать модальное окно, которое после появления висит 2 секунды и исчезает....

Загрузка изображения из API
Как правильно в React.js преобразовать изображение, полученное из API, - в строку base64? const App = () => { const = useState(" ") useEffect(() => { ...

Плавающая ширина input
Здравствуйте, возник вопрос, может кто-то знает как сделать плавающую ширину инпута? Стили написаны на material ui (material table), сам код на ts (react). У меня задание таковое, что нужно сделать...

Как менять состояние кнопки только у одного конкретного элемента, взятого из массива c map()
Как менять состояние кнопки у одного конкретного элемента, взятого из массива.map(), так, чтобы у других состояние не менялось вместе с ним??? const array = //пример массива function...

React не применяются стили
Доброго времени суток! :) Имею следующую ситуацию - подключаю к js файлу css stylesheet, но стили не применяются. Имена классов в теги добавляются, а стилей нет. Не добавляются как в таком...

Не могу разобраться как вставить ссылку
Здравствуйте у меня возникла проблема у меня есть кнопка мне нужно указать ссылку на эту кнопку но у меня не выходит помогите пожалуйста. Писал по разному в html <a href="http://yandex.ru"...

Как из json файла вывести изображение в react приложение
Начал изучение react столкнулся с проблемой: у меня есть файл json с данными о картинах: { "painting" : и файл paintings.js в котором происходит следущее: import React, {Component}...

SetState не обновляет дочерние компоненты
Всего 2 компонента, родитель и ребёнок для вывода через map в строке 276. Саме дурацкое, что через консоль лог показывает, что общая цена this.state.amount меняется, map тоже проходит по новому...

ООП в React
Перед изучением react нужно хорошо разбираться в ООП js или сейчас достаточно знать функции js и сразу можно изучать react? С появлением hooks, как я понимаю, он стал более функциональным.

Не работают Route
Всем привет, изучаю React и не могу понять почему не работают пути, localhost3000/user открывается но на ней только navbar index js ReactDOM.render( <React.StrictMode> <BrowserRouter> ...

Как редактировать сайт на ReactJS?
Здравствуйте, я только-только начинаю изучать React и у меня в голове сложилась примерно общая такая структура файлов На днях мне дали посмотреть на реальный проект. И такой файловой структуры я...

Привязка к value в input
Видел, что привязывают какое-то свойство стейта к value в input, затем каждое событие onChange вызывается функция в которой проводится каждый раз метод setState, для того чтобы сделать поле...

Анимация появления и сокрытия формы в React
Условие: При нажатии на кнопку должна с анимацией появляться форма, данные с которой отправляются на сервер. Введённые ранее данные сохраняются в localStorage, после отправки формы localStorage...

Не отображается выпадающий список
Здравствуйте! Изучаю React. Возникла необходимость сделать из JSONа многоуровневый select. в консоль выводятся значения, а вот в рендер не получается передать ничего. Помогите, пожалуйста. Что не...

Как вывести данные из массива JSON?
Есть компонент Item: return ( <div className="item"> <img src={ image } alt="pizza1" className="item-preview"/> <h3 className="item-name">{ name }</h3> <div...

Сортировка товара
Здравствуйте! Подскажите как сделать сортировку при выборе (названия, цены, рейтинга...) Есть код, import React, { useState } from 'react'; import myArray from '../myArray'; import...

Не работает scss в react-е
Здравствуйте. Не распознается синтаксис scss у меня в react проекте. Установил его, yarn перезапустил, прописал в webpack.config.js { test: /\.scss$/, use: ...

Как вытащить данные с backend?
Есть данные с бэка: Вот как я хочу забрать эти данные: const = useState()

Как перерендерить страницу
Приветствую всех, у меня возникла наверно довольно простая проблема, но я пока начинающий React разработчик. Я пишу свой TodoList и пробую при удалении объекта из массива перерендерить страницу, но...

Ошибка Uncaught TypeError: Cannot read property 'value' of undefined
Всем привет! Я новичок в react. Работаю с jHipster. Пытаюсь получить значение, которое выбрано пользователем в выпадающем списке Select библиотеки Ant Design. 1.Вначале, в событии...

Постраничный вывод данных на react
Привет. Сразу к сути - нужно сделать на react постраничный вывод товаров. Вывод всех товаров на страницу у меня реализован, но нужно чтобы на одной странице было не более 16 товаров. Подскажите...

Залить проект на хостинг
У меня есть проект на реакте. Мне нужно его залить на хостинг. Мне нужно для этого какой то бэкенд или webpack-dev-server сгодиться? Я просто раньше вообще с этим не сталкивался. Что нужно сделать,...

Как подгрузить картинку в компонент, если путь к ней лежит в json файле?
задумка: слайдер, у которого инфа для слайда(название, характеристики и прочее) содержится в json(для теста), там же и путь к картинке. не подгружает. подскажите, пожалуйста, как быть. "gazel":...

Как сделать каталог товаров?
Здравствуйте. У меня такой вопрос. Есть интернет-магазин, внутри него есть каталог товаров. В каталоге много категорий товаров. Необходимо сделать следующее: при выборе конкретной категории...

Как загрузить на сервер картинки через CKEditor 4. React
В общем я задал такой же вопрос на стек овер флоу, но хотелось бы узнать и ваши мнения https://stackoverflow.com/questions/59749038/how-upload-images-to-server-using-ckeditor-4 Суть задачи состоит...

Двойной рендеринг в React
Добрый день, начинаю изучать react, сделал авторизацию через Firebase, после того как зашёл на сайт и при обновлении страницы сначала прогруживаются кнопки, а потом показывает сообщение, что я уже...

Вставка данных в таблицу react
Здраствуйте, пишу для себя проект и тут хочу отмечать посещение людей. Данные получаю в json и хочу вывести их в таблицу с помощью Checkbox. Но так как данные приходят не особо красиво, то у меня...

Подключение Bootstrap
Доброго времени суток всем! В одном из скринкастов https://learn.javascript.ru/screencast/react#react-css для знакомства с React увидел, как автор подключает Bootstrap из терминала своего редактора...

Сортировка записей по дате создания
Здравствуйте, на данный момент в пагинации на первой странице ввыводятся старые записи на последней новые. Как отсортировать наоборот? Чтобы на первой странице были новые записи. <div...

Redux. Изменение store после удаления элемента
Всем привет. Разбираюсь с работой React и завис с одним моментом. Делаю заметки - отобразить из базы (mongodb), добавить новую, удалить. Сделал все, кроме удаления. Смысл загвоздки вот в чем:...

React.JS + Redux. Отправка запроса и чтение данных JSON
Всем привет. Работаю на ASP.NET Core. Подключил React/Redux. И теперь есть одна проблема. Создал код для подключения к серверу. Но почему-то не могу получить данные JSON. Вот код actionCreators: ...

Как вывести необходимые данные из массива объектов?
Здравствуйте! Только начал свое знакомство с ReactJS и нужно сделать сайт-тест знаний пользователя по определенной теме. Есть вот такой state. На данный момент не могу понять, как мне вытащить title...

Не могу разобраться: TypeError: Object(.) is not a function
13 | 14 | const store = createStore(rootReducer, 15 | compose( > 16 | applyMiddleware(thunk.withExtraArgument({getFirebase, getFirestore})), 17 | ...

Почему событие срабатывает только со второго раза?
Пишу клон трелло и событие написано на добавление доски и задачи но почему работает только со второго раза подскажите? Компонент где происходит событие export const...

Сортировка массива и его отсортированное отображение по клику на кнопку
Есть некий набор информации представленный в массиве. Проблема в том, что не могу реализовать через switch саму сортировку и отображение его же по нажатию на кнопки. Подскажите, пожалуйста , в чем...

Не получается поставить bootstrap
При попытке устаноки бутстрапа https://facebook.github.io/create-react-app/docs/adding-bootstrap через npm выводит npm install --save bootstrap npm WARN bootstrap@4.2.1 requires a peer of...

Добавить валидацию и отправлять форму, только когда поля заполнены
Допустим такой компонент и к нему тест. куда прописать следует заполнение поля title? import React from 'react'; export default class Order extends React.Component { constructor() { ...

Валидация мапы на Yup
Есть некоторый массив ключей const products = ; и стейт компонента в виде мапы import React, { Component } from 'react'; class Animal extends Component {

Получить значение ключа объекта
Добрый день коллеги. Получается вот такой код import React, { Component } from 'react'; import PropTypes from 'prop-types'; import styles from './MovieItem.module.css'; import * as...

Компонент React Select (Creatable). Как сделать так, чтобы при клике не открывался выпадающий список?
https://react-select.com/creatable Я хочу сделать так, чтобы выпадающий список с элементами списка открывался только при клике на области, помеченной оранжевым цветом на скриншоте (стрелочка...

Кредитный калькулятор
Ищу туториал (не видеоурок), где сказано, как сделать кредитный калькулятор.

При нажатии на кнопку скрыть компонент
На сайте имеются кнопки(1 изображение) при нажатии на лупу должно появляться поле поиска(2 изображение) на месте кнопок и названия ProgUser.js const buttons = ; return ( <App...

Аналог querySelectorAll в ReactJS
В нативном js для поиска дум элементов, чтобы узнать их количество я использовал querySelectorAll и lenght для определения сколько таких-то элементов существует у меня с нужным мне классом в данный...

Вызванный компнент функция появляется только после обнвления страницы
Всем привет. Вот начал изучать React JS Не могу решить одну проблему. Есть 2 файла. App.js и Main.js App.js import React, { useState, useEffect,Component} from 'react'; import logo from...

Загрузка json файла, используя запрос
Доброго времени суток! не могу получить json файл используя запрос - возвращает почему-то страницу. помогите разобраться, в чем проблема. файл load.js import React from 'react'; export...

Expo проект при запуске крашится npm ERR C:\npm-cache\_logs\2019-12-20T19_04_34_353Z-deb
> @ start D:\code\react-native\Firstproj > expo start Starting project at D:\code\react-native\Firstproj Expo DevTools is running at http://localhost:19002 Opening DevTools in the browser......

Разделение доступа в react / redux приложении
Есть родительский компонент, в методе componentWillMount проверяю соответствие роли, если роль не подходит делаю редирект class WrapperAdmin extends Component { componentWillMount() { ...

Как записать несколько обработчиков событий в "onClick"?
onClick={this.showConsole} Здравствуйте. Допустим я имею два или три обработчика событий и я хочу что бы они исполнялись при одном событии. Как это правильно записать в ...

Чтение для rectJS из json файла
Всем привет! Проблема: изменился формат подаваемого на вход json файла и не получается переписать код для нового фрагмента. Была программа, которая нормально читала данные из json файла для...

Как связать между собой текст списка и чекбокс в нем
Привет всем!есть список состоящий из массива, нужно сделать так что бы текст <li> зачеркивался и отменялось подчеркивание в зависимости от состояния checkbox'а. не могу понять как их связать если при...

ReactJs связать с opencart или другими CMS системами
Как можно связать reactjs с различными CMS системами, понятно что через API, но нужен конкретный пример и/или ссылка на урок где рассказывается как это делается. Спасиб.

Почему не размонтируется компонент?
Приветствую уважаемых коллег.! Сначала делаю так: render() { return ( <div> {this.props.conditionToShow && <Component1 />} </div> ) В этом случае, всё работает как надо: Каждый раз...

Axios отправка картинки на сервер
Всем привет. Есть у меня бэк и делаю для него front. Надо сделать форму регистрации, сделать, но она не отправляет изображение. Выводит ошибку 415. Просидел и продолбался 2 часа. Но нечего не...

Как обновить контент на странице из модального окна с использованием react-router-dom
Существует модальное окно, которое добавляется на страницу, нажатием специальной кнопки, и полностью удаляется со страницы, нажатием на кнопку закрытия. Я хочу добавить <Link /> внутрь модального...

Метод в Redux реагирует на клик со второго раза
Пробую пример для понимания редакса создал, 2 кнопки инкремент и декремент. Клацаю на любую из этих кнопок значение меняется лишь со второго клика на одну из этих кнопок и после этого же второго...

Ошибка TypeError: this.previousElementSibling is undefined
Почему происходит ошибка ? Uncaught TypeError: this.previousElementSibling is undefined class CustomSpinInput extends Component { onChange = (e) => { ...

Изменение цвета случайного div'a
Имеется игровое поле с 25 div'ами. По клику на кнопку "Play" случайный div должен окрашиваться в синий цвет. По клику на div с синим цветом он должен перекраситься в зеленый. Если клика не было - ...

Изменение состояния useState
Есть такой код: import React, { useState } from 'react' const Task = () => { const = useState( {name: 'Иван', age: 25, show: false} ); const handleClick = () => { ...

При клике на ссылку не открывается нужный контент, хотя url меняется.
Привет. При клике на ссылку не открывается нужный контент, хотя url меняется. После перезагрузки все подгружается или когда сам вручную меняю адрес. header.jsx import './header.css'; import {...

Передача значений между компонентами с использованием redux.
Добрый день. Необходимо передать переменную из одного компонента в другой, появилась идея использовать в качестве буфера Redux, но мне кажется, что это не совсем хорошая идея. Подскажите, это...

Отправка JSON и form-data одним запросом?
Добрый день, у меня есть форма с фотографией и текстовыми полями. Можно ли в одном POST запросе отправить и картинку и json, т.е, чтобы "Content-Type" был form-data и JSON

Передача функции от Родителя к Ребенку
У родителя есть функция updateText() {} нужно передать ее ребенку, чтобы там использовать - вызвать Изначально рендрю вот так <Task key={i} index={i}> так ошибок не находит но когда...

Вставить на страницу строку с тегами
Добрый день. Подскажите, как вставить на страницу строку с тегами? let header = 'qqq <b>eee</b> rrr' return( <div className='container'> {header} </div> ...

Галерея с модальным окном(и миниатюрами картинок)
Не могу найти галерею с модальным окном и миниатюрами для картинок https://jfcaiceo.github.io/react-lightbox-component/ Этот пакет хорош, но он принимает сами картинки и уменьшает их через ксс, а...

Оплата с использованием Stripe
Необходимо подключить оплату к сайту ,выбрал Stripe.При первой записи все работает ,но тут стандартная форма,так же нашел уже готовый вариант с готовой формой с оф библиотеки ,Но не понятно как...

Ошибка с babel
Как видите не получается поправить версию бабеля пробовал пару решений безрезультатно, у кого какие идеи??? ERROR in ./src/index.js Module build failed (from...

Не работает правильно Маска номера телефона
Здравствуйте. Не работает правильно Маска номера телефона. Когда пишу в поле номера телефона, то в state-те получаю артефакты, но не могу понять почему. Функция-маска, работает, но как только...

Обновление данных firebase в React приложении
Доброго времени суток!) Интегрирую в React-приложение типа todo-list подключение к Firebase. Получаю данные и добавляю их в state в componentDidMount(). Добавляю новый item в БД в...

Как сделать такой всплывающий React компонент?
Как правильно сделать такой простой React компонент? Без библиотек. При нажатии на кнопку, выводится информация к примеру "зарегистрирован"...... Нужен максимально простой компонент, который...

Обновление данных в форме
Доброго времени суток, появился вопрос по react'у. Есть код: export default class HelloWorldApp extends React.Component { constructor(props) { super(props); this.state...

Модальное окно с кастомным компонентом
Добрый день. У меня имеется react + redux приложение. В рамках приложения описан компонент модального окна, который вставлен в корень страницы и отображается на основе состояния из redux. Модалка...

Разница между React и React native
Я хочу начать освоение React для фрондента, но при этом хотел бы иметь возможность писать мобильные приложения. И поэтому у меня вопрос: эти фреймворки сильно отличаются друг от друга? Много ли...

Как изменить свойство при клике
Здравствуйте! Приведите пожалуйста пример (на функциональных компонентах) изменения одного из свойств при клике. К примеру, React отрендерил (есть массив объектов) через map все элементы массива:...

Как отловить событие перехода на страницу с redux?
Приложение создано с помощью react creat app, сверху поставлен redux и router. Хочу узнать как поймать событие перехода по ссылкам(компонент Link к компонентам-страница) внутри приложения.

Не отображается ReactJS
Только начал учить библиотеку React так сразу же не задалось. В качестве рабочей среды использую Visual Studio code. Решил написать простенький код по выводу надписи. Файл с jsx: import React...

Как избежать перерисовки незатрагиваемых компонентов
При нажатии кнопки меняется текст сообщения. Как избежать перерисовки не участвующего в этом взаимодействии грида ? Пример на codesandbox.io Код привожу и здесь import React, { useState,...

Массив из компонентов!
Надо вывести репозитории GitHub (например, только их имена). Есть компонент для одного, отдельного, репозитория. Как вывести весь массив репозиториев? Главный компонент App.js: import React...

useState поменять местами элементы массива
Здравствуйте!!! Подскажите, допустим есть массив cards, с помощь драг энд дропа я захватил элемент с id 1 и перетащил на элемент 4. Как поменять их местами в setCards?(обновить состояние в onDrop) ...

Использование setState с forEach.
В работающем примере import React from "react"; import ReactDOM from "react-dom"; import App from "./components/app"; import "./styles.css"; const listItems = ; const rootElement =...

Наложение изображений
Привет. Как подступиться посоветуйте, если сталкивались: нужно получить два изображения, наложить одно на другое и сохранить в третье. Есть мысли? СПАСИБО

Вывод данных полученных в axios
Всем доброе время суток. Сижу и пытаюсь разобраться в React, смог вывести одиночные данные полученные в axios, но не могу вывести массив данных. Может кто подскажет как то сделать? Я сделал fake...

Плавное изменение текста столбца таблицы при получении новых значений
Допустим есть массив { items: } Данные грузятьс и выводятся в рендере через map - всё ништяк, но мне нужно что бы компоненте li2 в его дочернем диве с классами val1 и val2 новые...

Как прокинуть ref в другой (чужой) компонент
Использую css-framework: react.geist-ui.dev В форме при проверке (react-hook-form), устанавливая ref в компоненте Radio, получаю ошибку: Function components cannot be given refs. Attempts to access...

При нажатии на Enter форма не отправляется
При нажатии на Enter форма не отправляется(хотя при нажатии на инпут с типом "submit" всё работает). В консоли появляется ошибка "Form submission canceled because the form is not connected". Как это...

React.js с Material-ui
Привет ребята! Возник вопрос и проблема с React.js. Я написал код который должен вывести мне кнопки в стиле Material-ui, однако браузер выдает ошибку: Uncaught ReferenceError: require is not defined....

Компоненты и пропсы
Добрый день! У меня есть массив с названиями животных, это выводится на экран с помощью картинок, я могу отсортировать массив картинок по группам животных - это работает, у меня один стэйт для...

Практика react-redux
Хотел я значит сделать игру, так как более менее основы знаю react+redux, а итоге такого наворотил, что понял, нужна практика и много практики, от малой до великой, посовейте, плиз, как практиковать...

react redux отследить изменение
Добры день. Есть redux в котором есть поле "areaListType" и когда я его меняю, везде, где происходит render значения меняются, но мне надо также отправить изменённое состояние в API. Отправка...

React компонент без рендера и получение содержимого контейнера
class UserManager extends React.Component { constructor(props) { super(props); this.state = { value: null, };

Сколько времени займет изучение фреймворка?(извините за тупой сами знаете что)
Знаю, вопрос глупый, у всех по разному и всё такое, кто-то может сказать хоть примерно нужно на изучение фрейма для поиска работы и конечно же полезные ссылки и книги для изучения не помешали бы,...

ReactJS. Почему не работает код? В консоли нет ошибок!
Почему не работает код риакта? В консоле нет ошибок, и на екране нету текста который я хочу вывести <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> ...

Изменение маски ввода input в зависимости от выбранного значения в select-box
Здравствуйте, подскажите (возможно есть готовый пример) как реализовать следующую задачу, имеется форма построенная компонентом formik , в которой используется react-select, на форме размещен...

Redux form попытка очистить конкретный field
Всем привет, есть такая форма. <form className={classes.listField} onSubmit={props.handleSubmit}> <Field validate = {} name = "filmName" type="text" label = "Название фильма" component...

Нужны ли знания Typescript если идти на на Junior UI Web Dev (React)?
Здравствуйте, нужны ли знания Typescript если идти на на Junior UI Web Dev (React)?

Unexpected string concatenation of literals no-useless-concat
Здравствуйте, уважаемые форумчане! Не могу никак избавиться от предупреждения в заголовке темы. Вот код: browser_update_link = "https://www.google.ru/search?q=" + `Как обновить браузер...

Всё тот любимый undefined
Здравствуйте! Не понимаю сути этой ошибки: При передачи данных в store пишет, что у меня undefined(хотя там есть данные)(проблемы с getPockeBlock): import React from 'react'; import...

React и Api: вывод элементов.
У меня есть API, с помощью которого я вывожу продукты. У меня продукты в API разделены на категории. И у меня есть кнопки категорий к этим продуктам, но они повторяются. Помогите пожалуйста: как...

react дождаться выполнения асинхронных функций
Добрый день. У меня две асинхронные функции ServiceApi.getMatgrouplist(access_token) .then((data) => matgroupListSuccess(data)) .catch((err) =>...

Сделать виджет комментариев
Напишите виджет комментариев на React со следующей функциональностью: 1. Отображение списка комментариев: автор, текст, дата и время 2. Добавление нового комментария (поля для ввода: имя...

Ошибка при создании React проекта: Maximum call stack size exceeded
Здравствуйте. Я новичок в React. Решил следуя туториалу настроить проект. Сначала запустил команду npm i -g create-react-app Ни одной ошибки не произошло. Далее, запустил команду create-react-app...

Множественный импорт SVG файлов
Всем доброго времени суток! Вводная по задаче: Есть около 100 SVG файлов. Требуется расположить в виде таблички эти SVG-изображения. При клике на карточку с изображением, нужно поменять цвет...

Почему синтаксис "useMemo" в моем коде вызывает предупреждение?
Здравствуйте, почему синтаксис "useMemo" в моем коде вызывает предупреждение? Сколько зависимостей я б ненаписал всеравно это предупреждение. Как это устранить? Нету предупреждения только когда...

multiple select
Здравствуйте! подскажите, как правильно создать многозначный select в react. Я сделал по-своему, работает правильно, но 'глючит' при выборе-отмене. class FlavorForm extends React.Component {...

Не рендерится компонент
Я имею следующий код: import './Form.css' import React, { Component } from 'react' import axios from 'axios' import Comment from "../comment/Comment"; export default class Form extends...

Не могу сделать редирект
Здравствуйте. Я использую React Routing, по этому все пути у меня содержат символ решетки после хоста. Вероятно по этому возникает следующая проблемма. Я нахожусь на странице вида...

React как сделать анимацию прозрачности при клике?
React как сделать анимацию прозрачности при клике? https://reactcommunity.org/react-transition-group/transition Тут, конечно, целый пример, но я не понял как подгрузить бибилиотеки с анимками....

Работа с DOM в React и на чистом JS
С Днём Победы! Пишут о том что работа React быстрее с DOM, чем на чистом JS, так как он работает с Virtul Dom, а только потом вносит изменения в реальный. Я не могу понять в чём это выражается?...

Морской бой на react
Решил сделать Морской бой на реакте. Была данная тема или нет. Но я не нашел(

Подключение глобальной БД в приложении React Native на андроид
Всем привет, пишу приложение для андроид на React Native. Нужно подключить файл бд и делать запросы с получением данных. Подключение сделал, ошибок с ним будто нет, но вот сделать запрос и получить...

Проблема с отображением картинки baseimage64 в gmail
Всем Доброго вечера, Не могу понять, почему в письме gmail не отображается конвертированная картинка imagebase64 . В отличии от gmail, outlook и другие почтовые клиенты отображают imagebase64 ...

Пример динамического импорта в react приложении
Всем привет. Подскажите где можно посмотреть пример динамического импорта компонентов в реакт приложении. Читал доку вебпака https://webpack.js.org/guides/code-splitting/ не совсем понял как это...

Виджет комментариев переделать с react на redux
вот этот код нужно переделать в redux с компонентами редьюсерами и так далее долго уже пытаюсь никак не получаеться( App.js import React, { Component } from 'react' import { format } from...

Как превратить переданные props в state?
У меня есть react контейнер который ходит по апи за данными. Данные рендерятся на странице и они же прокидываются по средствам props в модальное окно для редактирования вместе с колбеками для полей....

где можно преобразовать дату(строку), которая приходит из input, в дату(число), чтобы дату задать в setFullYear
const FirstPage = (props) => { const = useState(''); const = useState(''); const = useState(''); const getData = () => { debugger let nowDate = Math.round(new...

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

Проитерировать массив вместе с фото в объекте
Мне нужна ваша помощь. Я пытаюсь добавить в массив фотографии, а затем проитерировать его. Фотографии у меня находится в отдельной папке. Но у меня не отображается фото, отображается только иконка...

Передать json через пропс в другой компонент и вятынуть данные
Доброго времени суток. Подскажите в вопросе. Получаю данный из запроса (JSON), затем пытаюсь передать его в другой компонент через props, но не могу потом вытащить из него значение. ...

Посоветуйте курсы по React JS
Народ, всем привет. Вот недавно начал изучать React JS вот по этим видео: https://www.youtube.com/playlist?list=PLIcAMDxr6tpoShAiU0Nh_nBtg19XWbCql Подскажите, какие материалы изучали лично вы,...

Events.js:167 throw er; // Unhandled 'error' event
В общем, я создал приложение и поставил сверху express https://dev.to/loujaybee/using-create-react-app-with-express Затем я озаботился тем, что файл server.js не обновляется по хот модулю и решил...

Асинхронный useState
Здравствуйте!!! У меня вопрос в связи с тем что useState асинхронный. Например я хочу задизаблить кнопку дождаться выполнения запросов и раздизеблить кнопку сделав редирект. Хочу узнать можно ли...

Кто передал в функцию props
Доброго времени суток. Посмотрите, пожалуйста, скрин из консоли. В пропсах там сидят данные. Не могу понять откуда они взялись. Функция withSuspense вызывается в компоненте App в 39-ой строке....

Приближение и отдаление элемента находящегося в overflow: scroll с позиционированием на мышку
Всем добрый, пару дней уже мучаюсь с такой задачей: нужно реализовать просмотр pdf файлов и картинок в браузере. 1-а из функциональностей такого просмотра должна быть "приближение и отдаление"...

React Хранение переменных при обновлении страницы
Добрый день. Я получаю от сервера token и он необходим мне на каждой "странице", которая обращается к API. Где можно хранить этот token, что бы при нажатие кнопки "Обновить" в браузере он не...

Работа с асинхронными функциями
Всем привет, недавно начал учить react и столкнулся с такой проблемой Есть компонент Map в котором 2 метода. Метод getPosition - асинхронный запрос на сервер для определения местоположения...

React-dnd. При попытке перекинуть компонент - ошибка: Uncaught Invariant Violation: Expected to find a valid target
При попытке перекинуть карточку в пустой столбец возникает ошибка bundle.js:174 Uncaught Invariant Violation: Expected to find a valid target. at invariant...

Вытащить JWT токен
Ребят, подскажите кто знает можно ли как-то вытащить токен из Response Headers в Authorization и в дальнейшем вместо поля auth.login(data.token) указать правильное поле моего полученного токена. ...

Роутинг React.js
Здравствуйте! Возник вопрос: как работать с многоуровневой маршрутизацией. У меня компонент не отрисовывается, да и я не понял как вообще работать правильно с маршрутизацией. Т.е. если у нас...

Ошибка npm start в webstorm
Доброго времени суток,вопрос от новичка: почему выходит ошибка и как ее решить? npm ERR! Windows_NT 10.0.16299 npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Progra m...

React-теры подскажите (сортировка)
Коллеги подскажите как сделать из этого сортировку по возрастанию и убыванию. Пы\сы: гуглил очень много import React, { Component } from "react"; import ProductData from "../test.json"; ...

Реализация больших данных React
Всем привет, сразу к делу: Задача стоит так, есть Главная страница, где отображается список всех товаров, есть кнопка добавить. Потом на странице добавить, есть поля (Название и порядка 30 полей для...

Подключение React, babel в Webstorm
Уже 3 дня не удается правильно настроить react и Webstorm. Таже проблема з babel. Пожалуйста, напишите как грамотно ето сделать, или киньте ссылку на туториал.

Конвертер из JSX в HTML+JS+CSS
Есть проект на reactJS, нужно просто конвертировать его в статичный сайт HTML+JS+CSS. Как это сделать?

Как сделать чтобы функция вызывалась только после первого рендеринга?
Здравствуйте, подскажите как сделать чтобы функция extraFunc вызывалась только после первого рендеринга(функция не должна срабатывать каждый раз при нажатии на счетчик)? import React, {useState}...

Отправка формы по нажатию на чекбокс
Здравствуйте! Проблема такова: есть форма, в форме текстовое поле, 3 чекбокса и кнопка отправить. На сервер отправляется post запрос с данными текстового поля и состояниями чекбокса. Хочу также,...

React Thunk и обновление компонентов
Здравтсвуйте! Разбираюсь в redux-thunk. export const someAction = () => { return dispatch => { dispatch(actions.action1()); dispatch(actions.action2()); }

Настройка роутинга
Здравствуйте! Стоит задача при изменении некой переменной показывать различные компоненты. По сути авторизация, при успехе которой пользователю открывается админка. Сейчас сделано так: В App.js я...

Удаление по id
Есть проект, в нем надо реализовать добавление продукта и удаление. При попытке удалить происходит ошибка, не могу понять в чем проблема. FrontEnd - ReactJS, BackEnd - NodeJs, Database - MySQL. ...

Заменить цвет границ checkbox на свой в Ant Design
Доброго времени суток. Использую Ant Design Подскажите как изменить стандартный цвет границ у checkbox на свой при наведении на него курсором? Мне нужно, чтобы при наведении на содержимое checkbox...

Откуда тут массив с Промисами?
Здравствуйте! Скажите пожалуйста, почему вот этот кусок кода мне выдаёт массив промисов вместо массива объектов со свойствами и одним новым свойством, которое я пытаюсь добавить с помощью этого же...

Несовместимость React-Router и React-Bootstrap
Добрый день, Пишу маленький проект и в качестве дизайна решил использовать React-Bootstrap. При создании Навигации сайта использовал Nav. Я хочу при клике на любое меню рендерить с помощью...

Как правильно передать setState от ребенка к родителю
Всем привет. Мне нужно передать функцию setImages из компонента CardSlider (ребенка) компоненту Card (родителю). Вот часть моего кода: let Card = () => { // Много другого кода let...

Как разделить прод и дев версии в реакт приложении ?
У меня есть приложение на реакте, я хочу что бы когда билдилась версия был один путь, а при разработке другой. У меня путь прописывается в двух файлах: config.js const config = { url:...

Клиентская часть на ReactJS
Посмотрел туториалы по реакту. Все сводится к тому что есть некий index.html, а в нем какой-то элемент типо <div id="root"></div>. А потом мы рендерим туда что-то. Необходимо написать приложение...

Проблема с кликом вне модального окна
У меня есть два компонента Title и Post. По нажатию на ссылку в компоненте Title у меня должно открыться модальное окно и по хорошему должно закрыться если я нажму вне модального окна. И проблема...

Сайт погоды / apiWeather
Доброго дня суток) Начал изучать ReactJs после продвинутого JS(может я так думаю), у меня стала делема: У меня файлы разбиты на компоненты и я не могу изменить в input-е число напрямум(чтоб и в...

Динамическая таблица с select
Есть таблица: <table> { showTime && group &&<tr> <td>1</td> <td>2</td> </tr> }

Фронт (React) не отправляет запрос на бэк (Spring Boot)
Приветствую всех. Задеплоил фронт-энд и бек-энд как два разных приложения (со своими адресами) на Heroku. Адрес фронта: https://front-for-app.herokuapp.com. Адрес бэка:...

не работает кнопка
Почему при нажатии на кнопку ничего не происходит Раньше работало( теперь перестало import React from 'react' import Invoices from './Invoices'; import Header from './Header' function...

Не работает роутинг в продакшене create-react-app
Добрый день, Не работает роутинг в продакшен режиме create-react-app, в деве все нормально работает, подскажите пожалуйста что подправить. Index.js: import {BrowserRouter} from...

В компоненте react не обновляются input
https://i.ibb.co/QFp1QDm/testauto.png Реализую CRUD приложение. Добавление и удаление реализовал. Возник вопрос с обновлением. Для этого: 1) При нажатии кнопки "Редакт" передаю в компанент `App`...

Выделение пользователем области на изображении
Для курсовой необходимо сделать мобильное приложение на React-Native позволяющее пользователю выделять некоторую прямоугольную область в изображении из галереи и сохранять информацию об области...

JS React Как сравнивать значение формы со строкой (e.targer.value == '?')
Есть форма с двумя кнопками и событие. Не работает сравнение e.targer.value с value заданное кнопкам. onTaskButton(e){ e.preventDefault(); if (e.targer.value == 'But1') { ...

Запись данных в объект
доброго времени суток, столкнулся с проблемой по JavaScript, React! вот мой код:

LocalStorage очищается после обновления страницы
Работаю с LocalStorage впервые и если использовать обычный метод localStorage.setItem, то все работает. Однако нужно подключить функию с другого файла. И вроде оно создается, однако после обновления...

React redux получить изменённое значение
Добрый день. При работе возник такой вопрос: По клике на кнопку я вызываю функцию, которая меняет значение в redux stor, всё отлично, она меняется и делается правильные рендер, но как мне её...

Не загружается изображение
Подскажите, почему не получается импортировать картинку? import ava from './s1200.jpeg'; <NavLink to={path}><img src={ava}/>{this.props.name}</NavLink> Изображение находится в той же папке, что и...

Не работает функция jquery внутри компонента react
Здраствуйте, помогите найти причину, не работает функция jquery внутри компонента на react , вот так выглядит компонентimport React from 'react'; class CaroselPagination extends React.Component { ...

Добавить в уже существующий объект свойство и положить в него объект
У меня имеется такая вложенность в редьюсере initialState = { prop1: { props2: { prop3: {id: '123', text: '222'}, prop4: {id: '321', text:...

Зафиксировать кнопку ReactJS
Помогите, пожалуйста. Как мне в ReactJS сделать липкую или неподвижную кнопку, при скроллинге страницы?

Не работает push на главную страницу после регистрации
Здраствуйте! помогите найти в чем ошибка, мне нужно после того как данные с инпута записались localStorage сделать push на главную страницу. но почему то не срабатывает, что не так?...

Отправка данных формы на Firebase
Приветстсвую! У меня задача отправить данные из формы на Firebase. Я использую Redux Form. Получил данные из формы в виде объекта. Написал скрипт для отправки данных в базу данные, но ничего не...

React и не только
Добрый вечер, представьте, есть человек, который делал лендинги и работал с html/css немного js/jquery, php только для многостраничников и отсылки форм на почту. И прилетело ему задание, интересное,...

React-native работа с expo FileSystem
Всем привет! Возможно вопрос глупый, и даже очень, но решения найти не могу, даже нагуглить. Мое приложение сделано через react-native init myProject (пока работаю под андроид) Нашел...

Как отобразить как props img у компонента?
Всем доброго времени суток! Начал разбираться с Реактом и делаю маленькое простенькое приложение. Один компонент должен использоваться несколько раз, но меняется текст и картинка для него. С...

Контролируемые компоненты в React и постоянный рендеринг
Есть код добавления item'ов к ul. state = { value: '', items: , }; addItem() { this.setState((prevState) => { const items = ;

Обновление свойств компонентов на обновление состояния родителя
Компонент Clock отрисовывается 500 раз. Внутри тикает таймер и когда компонент один - все ОК. Но когда их 500 (по всем временным зонам из либы moment-timezone) - все плохо (страница сильно грузит...

Module parse failed: Unexpected token
При запуске скрипта "build": "webpack --config webpack.config.js" Выдает такую ошибку: ERROR in ./src/index.js 12:2 Module parse failed: Unexpected token (12:2) You may need an appropriate...

Не могу отправить axios post запрос
Всем доброе время суток. Сижу и пытаюсь отправить данные на сервер в виде: { "title": "", "portions": "", "weight": "", "ingredients": , "cook_stages": , "tags": }

Передача свойств между классами
const {active} = this.props; return ( <div> {console.log(active)} <button{active}>test</button> <button>test</button> ...

Асинхронный запрос
Запрашиваю данные с БД, потом экспортирую, и когда испортирую в другой файл, то приходит promise. Как сделать, чтобы не promise приходил, а данные? const elementsData = () => { const dataDb =...

Как добавить картинки через props в React Carousel Image Gallery?
Как добавить картинки через props в React Carousel Image Gallery ?

Redux-Semantic-UI-React
Фронтенд разработка для веб традиционно делится на оформление (HTML/CSS) и интерактивность (JS). Но на самом деле всё это тесно связано между собой, а при использовании React так вообще, его...

Бесконечный вызов dispatch
Всем добрейшего времени суток. Столкнулся с неприятной ситуацией, когда начинают бесконечно вызываться два диспатча, если один из них я кидаю в then у промиса. В общем: есть Thunk export const...

Не могу передвинуть ползунок <input type=range /> из-за react-indiana-drag-scroll
Здравствуйте, уважаемые форумчане! Столкнулся со следующей проблемой. Есть фон в несколько экранов со звездами, на нем есть планеты, которые отображаются в центре фона (центральный экран - экран...

Не компилируется компонент
Здравствуйте. Я новичок в ReactJS, только изучаю его. Я написала небольшой компонент, но при компилации через webpack babel получаю ошибку и не понимаю, то неправильно я написала ? Подскажите,...

Uncaught TypeError: Cannot read property 'apply' of undefined
ввел npm run build открыл index.html в браузере без локалхоста выдало ошибку Uncaught TypeError: Cannot read property 'apply' of undefined in index_bundle.js что поправить? Вебпак const path...

Module not found: Can't resolve
Не могу понять, почему не находит модуль. Когда как в другом файле по этому же пути всё хорошо импортируется.. Ошибка в 14 строке (прикрепил скриншот, чтобы видели папки и файлы)

Отрисовка по условию
Мне нужно отрисовать по условию дочерний компонент <Page1/>. В текущей версии моего кода он не отображается. Если вставить в html разметку, то ошибок нет, компонент отрисовывается нормально. Я...

Рендеринг таблиц с большим количеством элементов
Собственно, кто сталкивался, нужно отображать данные в таблице, когда элементов в таблице 200-300 все нормально, но когда их более 1000, все начинает сильно зависать, могу дабивить пагинацию, но в...

При нажатие кнопки ничего не происходит
В первый раз работают с web из-за задания в вузе.У меня есть кнопка "Логин" и при нажатие на нее не открывается модальное окно(oneClick прописал). Так вот не могу понять почему нет ожидаемого...

Можно ли использовать вызов функции генерации id в reducer
Здравствуйте. Есть вопрос. Можно ли использовать вызов функции генерации id (7ст) в reducer (допустим что существует только Redux core)? //............................................ switch...

Redux-toolkit, как обновлять slice внутри другого slice
Добрый день, использую в React приложении Redux-toolkit и есть некоторые проблемы. Имеется хранилище с вызовом модального окна с информацией об ошибки. Туда нужно передать информацию (title, true...

Undefined API React
Добрый день! Разрабатываю простенькое crud приложение c интеграцией с готовым backend. Возникла проблема: данные, которые отправляются на сервер получаются Undefined и не отображаются в итоговой...

Посоветуйте практический курс на React redux/ react
Всем привет. Столкнулся с тем, что мне не хватает практики. Подскажите какой практический курс по реакту. типо...

Как передать значение из useEffect
У меня есть хук для получения результата const = useState(0); в одном из case я его использую case '=': if (text === '0') return const operator: string =...

Redux создание элемента по клику на кнопке
Нужно сделать так, чтобы при клике на кнопку New создавалось самым верхним новое пустое поле для заполнения, а после внесения всех данных, при нажатии на Add, эти данные должны уже "закрепиться" в...

Не пойму, как работает FormData
здрасьте есть форма redux-form, из которой я пытаюсь достать данные(ну с этим всё ок) и запихать эти данные в FormData(а вот тут пиндыр): <McsEditForm ...

Передать полученный с сервера initialState в store
Добрый вечер! Помогите, пожалуйста, разобраться со store. Когда я запускаю проект, в файле App.tsx создается store. В reducer передается initialState с начальными значениями. Я пытаюсь...

Как подписаться на изменение store в redux?
Как правильно подписаться на изменение данных в определённом месте store, в другом месте сайта если произошло изменение будет отправляться запрос при заходе на страницу.... subscribe наверное не...

React hydrate и ssr Did not expect server HTML to contain
Здравствуйте!!! Пытаюсь по крупицам из интернета собрать билд который позволит делать Server Side Rendering. Сейчас столкнулся с проблемой Warning: Did not expect server HTML to contain a <div> in...

Как получить свойства дочерних компонентов из родительского компонента?
Вот код https://jsfiddle.net/BossBossEx/n5u2wwjg/66204/ В строке 28 я меняю значение свойства chosen у компонента, по которому происходит клик мыши. У него же в 32 строке я беру родителя и прохожу...

Пытаюсь подключить библиотеку Date-fns
Всем привет, пытаюсь подключить библиотеку js date-fns. Делаю все по официальным документам , но выводит ошибку - RangeError: Invalid time value. Подскажите как исправить.

Отмена действия привязанного на клик по строке в таблице
Здравствуйте. Имеется таблица с 3 столбцами, последний из которых содержит кнопку. На клик по строке привязано действие. Но мне не нужно выполнять это действие при нажатии на кнопку, нужно...

Фильтр для сайта
Нужно сделать вот такой фильтр для сайта с использование React, Redux, данные брать с JSON. Подскажите с чего начать, возможно есть у кого примеры, наработки или источники где описано создание...

Сохранение стейтов при перезагрузке браузера
Подскажите как сохранить стейты в браузере

Не подгружается сайт на реакте в iframe
Добрый день! Пишу js обвязку для сайта, который должен крутится в iframe, но почему-то сайт в теге iframe не подгружается полностью. Сайт, который нужно крутить в фрейме - написан с использованием...

Ошибка теста Jest Enzyme
Здравствуйте! Начала писать тесты для react-компонента (С помощью Jest и Enzyme), но появилась вот такая вот досадная ошибка. С чем она может быть связана? Помогите, пожалуйста) Ошибка: Test...

Прочитать вложенный объект внутри Json
При запросе отправляю объект Data: public class Data { public Data() => NestedData = new NestedData(); public int Value { get; set; } = 999; public...

Заставить страницу обновиться после onClick event
Я хочу что бы после того как происхоидит event (юзер логинится или разлогинивается) кнопка менялась. Как только юзер вошел <button onClick={logOut}>Logout</button>, как только вышел <button...

Пагинация API GitHub
Помогите с пагинацией с API GitHub. App.js: import React from 'react'; import Pagination from './components/pagination'; import Info from './components/info'; import Reposit from...

Не работает обработчик события
Здравия всем! Изучаю реакт, знаю, что через ref обработчики не надо делать Но данная тема входит в обучение, и надо самому сделать обработчик на кнопку таким образом Вот код, и он не...

events.js 196 Error:spawn cmd ENOENT
Здравствуйте. events.js:196 throw er; // Unhandled 'error' event ^ Error: spawn cmd ENOENT ← } error Command failed with exit code 1. info Visit...

Передача параметров между компонентами
Доброго времени суток. Решил познакомиться с реактом, сделав простенький интернет-магазин и столкнулся с такой проблемой: у меня есть несколько роутов, главная страница, 404, логин и т.д. На...

Как получать расстояние с карты. yandex-react-maps
Начал учиться писать карты для пользователя. Есть постоянная точка, нужно поставить еще один маркер, сделать между ними маршрут и получить расстояние между ними. Как это реализовать, есть ли понятная...

Можно ли в данном случае заменить getElementById на обращение через refs? Как это должно работать?
Здравствуйте! Есть вот такие вот функции в компоненте. Функция getFilters получает на вход массив выбранных атрибутов и отображает в виде тест + кнопка. Когда пользователь нажимает на кнопку,...

Не запускается приложение на телефоне
Почему не запускается код в react native, исправьте ошибки пожалуйста import React from "react"; function f(value) { return value.split("").reverse().join(""); } export default function...

Как правильно сделать заглушку для сайта на React JS?
У меня на сайте есть заглушка по типу "перейдите в play market \ app store" и скачайте приложение... Она должна появляться при ширине экрана меньше 1000px. Я просто создал этот компонент, повешал...

Выделение текста мышкой в textarea
Если создать html страничку без react, и кинуть на нее textarea, тогда получается выделять текст в нем мышкой Если же создать страничку через react, тогда выделение мышкой недоступно Думал все...

Почему при попытке обновить state из useEffect он не обновляется?
Почему при попытке обновить tabsFields из useEffect он не обновляется? // Apollo Client запрос к GraphQL серверу const { data, error, loading } =...

flex in react
Пытаюсь сверстать простой сайт, макет до банальности прост. <div className={'m-div'}> <div className={'main-content'}> main </div> <div...

Использование одного компонента несколько раз
import React, {Component} from 'react'; import './App.css'; import up_arrow from "./images/up_arrow.png"; import down_arrow from "./images/down_arrow.png"; import up_arrow_active from...

Почему в ReactJS Visual Studio не подсвечивается синтаксис?
Такая проблемма когда я пиши просто на js у меня весь синтаксис все подсвечивает а когда взял html код для react js у меня синтаксис в visial studio перестал подсвечивать помогите пожалуйста ! ...

Изменение backgroundcolor DIVa
Случайному DIVу, выбранному с помощью math.random по нажатию button присвоен синий цвет. Как в этом же случайном DIVе по клику мышки изменить цвет на другой (скажем,-зеленый)? import React, {...

Компонент обертка
Можно ли в реакте создавать компоненты обертки? Есть вот у меня компонент: class HomeHeader extends Component { render() { return ( <header className="bg-gray-900 h-20 w-full...

Секундомер
здравствуйте, подскажите как исправить отображение чисел при выводе. (должны выводится 00:00,00 а выводятся в столбик) (Основной код) mport React, {useState} from 'react'; import { Text, View,...

Яндекс карта в реакт приложении
Всем привет. Помогите пожалуйста решить следующий вопрос ломаю голову ни как не могу найти в чем проблема! Вообщем пытаюсь сделать на сайте прямоугольник с картой создаю 350 на 350рх и в него...

Массив в рендере(неужели всегда надо перерисовывать?)
Понимаю, малось стрёмный вопрос, просто я сейчас делаю такую штуку, в которой по сути есть таблица, у которой всегда должно быть одинаковое количество tr, но в зависимости от ряда приходящих в json...

Ошибка: "Shallow rendering works only with custom components but the provided element type was object"
Не проходяд тесты из-за ошибки shallow rendering works only with custom components but the provided element type was object В чём проблема? import React from 'react' const Button = (props) => {...

ReactJS. Запретить второе нажатие на div.
Доброго времени суток! :) На div блок навешен onClick, определенный React компоненте. Вопрос: можно ли его убрать? Т.е. предотвратить вторую обработку onClick. Заранее благодарю за любые советы...

[React Native] Как только я изменяю текст в TextInput он сразу же восстанавливается назад.
Всем, привет. Я недавно начал заниматься разработкой на React Native и столкнулся с проблемой. Я через парсинг JSON получаю текст и пытаюсь поместить его в TextInput. Все хорошо парсится и TextInput...

Загрузка приложения на React в iframe
Всем привет. Есть приложение React на typescript и я хочу его запустить в iframe со стороны другого React приложения. Я беру бандл подгружаемого приложения указываю на него путь. Но там есть функция...

Импорт библиотек из node_modules
Доброго дня, дорогие форумчане. Подскажите пожалуйста, столкнулся с такой задачей и не пойму как её правильно решить. Ситуация следующая: Пишу проект на React с применением TypeScript (js...

Двойной рендеринг
Добрый день, начинаю изучать react, сделал авторизацию через Firebase, после того как зашёл на сайт и при обновлении страницы сначала прогруживаются кнопки, а потом показывает сообщение, что я уже...

React-native Получение данных из БД MySQL в <Text>
Добрый день! Подскажите пожалуйста как я могу получить данные из бд MySQL при помощи php в Text Например я хочу получить кол-во заказов пользователя: select count(ordername) from order where...

React адаптивное меню
У меня есть работающее адаптивное меню на React. Когда я уменьшаю размер страницы до адаптивного размера (450px) у меня оно показывается, как уже меню открыто, а надо чтобы при уменьшении оно сначала...

React Redux, хранить данные локально или глобально
Добрый вечер, вопрос таков: с сервера приходит список объектов, он используется только для отображения в компоненте, стоит ли этот список хранить в store? Если нет, то тогда как оставить...

ReactJS - Ошибка в консоли.
код с ошибкой в консоле вижу что проблема в начальном состоянии, но я не пойму что не так <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Components</title> <script...

Create-react-app: Unexpected end of JSON input while parsing...
Пытался загрузить библиотеки react но вылазит ошибка...

Никак не могу понять зачем react'у нужен node.
Никак не могу понять зачем react'у нужен node, ведь он работает на стороне клиента. Может кто нибудь понятно объяснить? В гугле был ничего не нашел.

Зачем в примере в setState стрелочная функция?
После пхп и пайтона синтаксис js / react с трудом дается. А курс по реакту еще и на английском. Потому где-то что-то упустил, просьба пояснить, почему надо писать так: <button ...

Форма регистрации: как сделать редирект при вводе определенных параметров в форме?
Всем привет. не могу разобраться как сделать редирект при вводе определенных параметров в форме. Форма material ui. Роутинг подключил через RouterLink. по кнопке при нажатии (независимо от того что...

ReactJS - чтобы работал без инета
здравствуйте, только поинтересовался, что такое ReactJS, в примере <script src="https://unpkg.com/react@16/umd/react.production.min.js" crossorigin></script> <script...

Ошибка You should not use NavLink outside a Router
Доброго всем времени суток! Изучаю react, добрался до темы роутинга и при попытке создать NavLink в меню получаю следующую ошибку: ./node_modules/react-router-dom/modules/NavLink.js SyntaxError:...

Почему context возвращает false?
Здравствуйте. Почему когда я пытаюсь вставить значение переменной из контекста в useState (например так: useState(context.name)) у меня контекст возвращает false. А когда я пытаюсь получить...

Где можно быстро выучить React JS?
Ребята нужно быстро(1 месяц) выучить React JS , но Фронта нечего не знаю, но знаю C++,C# и Java , где можно быстро выучить React JS , какие сайты рекомендуете или книги или что-то другое(на русском...

Создание div с его вложенными элементами
Добрый, компонент получает массив цветов, нужно сделать вот так <div style={{border:"solid 2px " + this.props.array}}> <div style={{border:"solid 2px " +...

React Js
Добрый день, хочу получить пару советов и наставлений от людей, которые имеют достаточно много опыта в JS, HTML и CSS и т.п. Дело в том, что на данный момент жизни для себя решил, что хочу...

Доступ к буферу обмена
Всем привет! Как можно в реакте (или в нативном жс) вставить в инпут значение из буфера обмена? Т.е. юзер где-то там у себя копирует что-то (строку, например), а у меня инпут текстовый, а рядом...

Необходимо создать три кнопки во внутренней странице (во 2о странице)
VK Mini Apps ("web") на React. Есть страница. На странице 5 активных кнопок (Тренировки, Питание, Музыка, Спортпитание, Спорттовары, Мои результаты). При нажатии на эти кнопки, мы переходим на...

Как сделать такую галерею на React JS?
Можете подсказать как сделать компонент такой галереи (фото ниже), или может уже есть такой-же пример... Что-то я найти не смог...

Как передать идентификатор элемента, который запускает событие onClick
Допустим есть некий div: <div onClick={ () => dispatch({ type: DIV_CLICKED, obj: ВОТ ЧТО ТУТ ДОЛЖНО БЫТЬ??? }) }></div> Подскажите, пожалуйста, что мне сюда такое вписать, чтобы в итоге...

Большое количество импортов - плохо?
Господа! Кто давно работает в React? Помогите разобраться. Есть некий файл. В нем слишком много импорта: import mother from './images/mother.jpg'; import mouse from './images/mouse.png'; import...

Ошибка при создании проекта React с помощью пакета create-react-app
Привет. Пытаюсь изучать JavaScript. Дошёл до библиотеки React. Пытаюсь создать первое приложение. Ввожу в терминале команду npx create-react-app my-app и получаю результат: npx...

React this.handleLoginClick = this.handleLoginClick.bind(this);
Добрый день. Читаю реакт документацию https://ru.react.js.org/docs/conditional-rendering.html и не могу понять, зачем нужна эта строчка кода? На мой взгляд, можно обойтись и без неё. Если...

Работа с LocaStorage
Здравствуйте, столкнулся с некой проблемой, у меня есть приложение на React, где через api ключ выводятся фильмы, есть возможность добавить фильм в избранное, сделано с помощью localStorage , но вот...

Не срабатывает alert()
Почему не срабатывает alert при нажатии на button " Save "? Component 1 import React from 'react'; import MainView from './components/MainView'; import CreateInvoiceForm from...

CSS transition, max-height
Доброго времени суток. Имею ситуацию, которую не могу понять как разрешить. Имеется боковая панель, содержащая в себе список с элементами разной высоты (зависит от длины текста). При сворачивании...

События в react js
Вот мне немного неясен момент с this._inputElement.value. В рендере оно заменится на event.target.value? Если да, то почему бы не написать это сразу? import React, { Component } from 'react';...

Objects are not valid as a React child (found: TypeError: response[0].includes is not a function). REACT
Всем привет. Создаю страничку на React. Смысл работы примерно таков : пользователь заходит, выбирает из первой таблицы типы аккаунтов-> нажимает на кнопку поиска аккаунтов и ему выпадает другая...

Сканирование штрих кодов с веб-камеры @zxing/library
Привет всем, есть прокт на реакте. Есть библиотека для сканирования баркодов. В моем случае нужно сканировать, на ресепшене баркод с веб-камеры. Сама библиотека...

Вызвать render() только одного компонента
import React from 'react'; import First_module from './First_module'; import Second_module from './Second_module'; class App extends React.Component { render() { return ( <div>

Css в нескольких файлах для приложения на react native
Поступил запрос на то, что бы разделить ксс по компонентам для моб приложения на react native. Я немного не понял смысла это делать, т.к. стили как правило пишут "обобщенными" что бы блокам с одной и...

Как добавить карту в React приложении?
Делаю интернет-магазин. Нужно на нескольких страницах создать карту с местонахождением магазина. То есть не просто картинку в виде скриншота, а чтобы с картой можно было взаимодействовать. Т.е....

You appear to be using a native ES module configuration file, which is only supported when running Babel asynchronously
Полная ошбика "Parsing error: You appear to be using a native ECMAScript module configuration file, which is only supported when running Babel asynchronously". Эта ошибка почему то появляется и...

useState initial state или useEffect
Здравствуйте!!! Я так понял что можно в useState передать функцию и стелать както так: const = useState<IInitialValues>(() => { const saved = localStorage.getItem('articles') || '';...

Styled-components - к children компонента не применяется стиль
Всем привет! Возникла проблема со styled-components - стиль не применяется к компоненту: Компонент, который будет стилизоваться: import React from "react"; export const...

Как реализовать функцию редактирования заметок в моем случае ?
Работаю над тестовым заданием - нужно написать список заметок на реакте. Прикрепляю ссылку на проект на gitHub, для лучшего понимания ситуации....

react дождаться выполнения Promise.all
Добрый день. Подскажите, как можно дождаться пока промис завершит работу? Promise.all().then(()=>{ console.log("QWERTY 2: "); }) console.log("QWERTY 3: ");

Не рендерятся stateless компоненты
Вот, к примеру, компонент: import React from 'react'; import { NavLink } from 'react-router-dom'; export const Nav = () => { return ( <ul className='nav'> <li> <NavLink...

React Render Performance ?
Какими средствами можно отслеживать рендер react-компонентов? В ручную каждому компоненту писать что-то подобное не удобно render() { console.warn((this.name || this.displayName) + ' was...

Создание ссылки на whats app
Добрый день, Подскажите, как сделать ссылку открывающую в новом окне диалог в вотсапе с разными клиентами при клике на их номер телефона? Спасибо genClientPhones(phones){ return( ...

React + VCS
Недавно начал изучать React, хочу его использовать для своего простого проекта. Так как я вынужден довольно часто ездить, у меня 2 рабочих машины + ноутбук. Все проекты которые я раньне...

Добавление внешнего файла .js к App.js
Здравствуйте, уважаемые форумчане! Никак не могу подключить внешний файл test.js к проекту. Как это можно сделать? Пробовал использовать react-helmet, ничего не получается. Вот код: test.js var...

Кука уходит в Redis, но не уходит в браузер
Здравствуйте, уважаемые форумчане! Никак не могу понять, что не так. Раньше все работало. Я создаю куку на сервере, но она не уходит в браузер, уходит только в БД на сервере. Код на клиенте: ...

Хороший пет-проект на Реакт для резюме
Всем привет. Ищу свою первую работу в IT, фронтендером, основа моего стека - JS+React. Т.к. никогда раньше в IT не работал, в резюме есть только пет-проекты. И в связи с этим встал вопрос - какой...

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

Условный рендеринг в react native c FlatList
У меня есть массив с объектами (пример ниже) и нужно с помощью рендерить на странице, но рендер должен происходить только тех объектов, у которых поле type = 0. Если честно, то не совсем пойму как...

React обновить график
Как нарисовать график я понялю как кпримеру с этой библиотекой https://www.youtube.com/watch?v=28ZbeLWmfiQ рисуется вроде. Но допустим у меня есть сторонее апи предостовляющее данные по разным...

При подключении библиотеки "fs" консоль бьёт ошибку fs.readFile is not a function
Такая проблема наблюдается как с родной библиотекой так и в библиотеках, которые юзают её. Пробовал накатывать вручную её, но успехом не увенчалось. Есть ли какие-то мысли почему может быть??

Как работает setState()?
Доброго времени суток! Поясните, пожалуйста как работает метод setState() в данном коде. import React from "react"; import ReactDOM from "react-dom"; const UNIT = { KPH: 'Км/ч', MPH:...

Валидация формы через React Bootstrap
Добрый день, Помогите с валидацией формы React Bootstrap. Использую вот этот подход. function FormExample() { const = useState(false); const handleSubmit = (event) => { const...

Иконка для сайта на next.js не устанавливается
при начальной загрузке страницы появляется,и тут же исчезает. называется favicon.ico. находится в папках app и public. подключается к проекту в корневом лояуте: const Layout = ({children}) => { ...

Передача props нескольким компонентам
Есть один родительский класс с некоторыми данными, есть несколько других классов. Могу ли я передать значение пропсов родительского класса нескольким компонентам? Что-то вроде render() {return (...

Редюсер вызывается два раза
При таком коде reducer вызывался 2 раза: const = useReducer((state, action) => { changeNow('journal') if (action.pupil) { state.pupils.push(action.pupil) ...

Паттерны React
Добрый день. Подскажите, как сделать обёртки для следующего кода: import React from 'react'; class Page extends React.Component{ Answer = { value : ''

Нужен совет, как добавить событие onBlur на два тега?
Я для практики пишу поиск стран У меня есть компонента SearchForm, у которой есть input, где и надо вводить названия стран. При каждом вводе срабатывает onChange и выводиться список стран под этим...

Как наложит поверх видео прямоугольник ?
Дали тестовое задание , - В момент возникновения события в плеере поверх видео должен рисоваться зелёный прямоугольник, соответствующий области, определённой в событии. Прямоугольник должен...

Не получается определить "useLocation hook" из "React Router"
Здравствуйте. Столкнулся с такой проблемой. Нужно стало воспользоватся useLocation в файле, но когда я только определил (pages.js) ст 51 мне выпадает такая ошибка: Error: Invalid hook call....

combineReducers создает вложенный объект
Добрый день. Возникла проблема, что combineReducers получая в state объект, возвращает его же но вложенным еще в один объект. Мой код: phrases-reducer.tsx const initialState = {dialogs :...

Как добавить класс при клике
Подскажите как при клике на ссылку добавить для нее класс, а при клике на другой - убрать import './App.css'; import { BrowserRouter, Link, Route } from 'react-router-dom'; import { Main }...

Взять данные из JSON, не зная структуры
Приветствую! Занялся React.js. Есть задача, получать данные с сервера в виде JSON файла и выдавать их в таблицу. Проблема в том, что файл может приходить разных видов с разными полями у объектов, но...

NavLink
Здравствуйте ! Не могу понять почему при смене адреса не назначается ссылке active class . Меняется адрес в адресной строке происходит переход но class не меняется. Ошибок в консоле нет ...

npm run build выдает странную ошибку
npm run build выдает странную ошибку "." не является внутренней или внешней командой, исполняемой программой или пакетным файлом. в package.json команда выглядит так "scripts": { ...

Create-react-app development mode с php
Каким образом можно при разработке ссылаться на бакэнд файлы php? вписать ссылку "./controller/HomeController.php" работает только с продакшен ...

собственный redux, как написать useSelector?
Всем привет, столкнулся с интересным заданием и решил проверить себя. Нужно написать собственную реализацию редакса. Сейчас проблема в том, что не понимаю как подписаться на обновление стора ссылка...

Enum не читается в блоке условий (if else, switch)
Доброго дня и чистого кода всем. Пытаюсь работать в React с Enum, полученным с сервера (Spring) в качестве ответа в процессе загрузки файла в базу данных. Прлучаю этот ответ и веду его до тех пор,...

Как вывести информацию в label
Необходимо чтобы в label выводилось значение count после нажатия на кнопку -,+,reset Код: import logo from './logo.svg'; import './App.css'; import React from 'react'; function App() { let...

Обновление таблицы после удаления объекта
Доброе время суток! У меня есть следующая таблица: return <Table striped> <thead className="thead-dark"> <tr> <th>Табельный номер</th> <th>ФИО</th> ...

Как подключить onClickOutside к компоненту-классу с редуксом?
https://github.com/Pomax/react-onclickoutside Как подключить onClickOutside к компоненту-классу с редуксом? Я думал, что будет достаточно compose import './Header.scss'; import {logout}...

Visual Studio Code Проблемы с React
Здраствуйте, не нащёл где лучше разместить тему создал экзепляр create-react-app открыл в visual studio code попытался создать простейший компонент. создал src->FComponent.js вбил код import...

React Redux и useSelector
Здравствуйте!!! Подскажите на каком этапе нужно преобразовывать данные например добавить юзеру поле профайл если он админ: Я это могу сделать в экшене получив ответ от апи и записать в стор, а могу...

Можно ли сразу сгенерировать js из jsx?
Как я понимаю, сам реакт в итоге всё равно компилит js код из jsx файла при каждой загрузке страницы. А можно ли как-то сразу получать js в файлах и грузить именно их? Добавлено через 29 минут Ну...

Не могу передать в пропсы состояние из хука
Передаю по клику индекс элемента в редьюсер, меняю в массиве состояние по индексу(true, false) и возвращаю массив состояний, нужно ли еще использовать какой-нибудь хук для отлавливания изменений в...

Как вывести все объекты на страницу, ссылка запроса должна меняться по нажатию кнопки, т.к. данные на разных страницах
Всем привет, я новичок и дико туплю, помогите плз) По запросу https://swapi.dev/api/planets/?page=1, выводится 10 планет на страницу, не могу дописать так, чтобы по нажатию кнопки , запрос был с...

React асинхронное выполнение запросов к API
Добрый день. Помогите разобраться Необходимо загрузить два набора данных с сервера, потом проделать над ними манипуляции. Я думал, что Promise.all сначала ждёт отработку всего, что внутри, а...

MobX. Можно ли импортировать store в модель другого store, если нужно использовать данные обоих stores?
Mobx. Подскажите, пожалуйста, как правильно описать структуру кода, когда нужно чтобы в модели одного store использовались данные другого store. /stores RetailersStore.ts ...

axios не выводит json полученный от API django
Всем привет ещё раз. У меня есть bec написанный на django. У меня есть фронт написанный на React( ну как есть, он в написание) И сейчас возникла проблема, если я возьму json данные полученные от...

document.addEventListener не видет функции класса
Добрый день. Добавляю подписку на события нажатия клавиши componentDidMount(){ document.addEventListener("keydown", this.moveKey); } moveKey(e) {

redux запрос на сервер - разъясните основы
Добрый день. Помогите разобраться начинающему. Начал изучать Redux. При изучении начальное состояние state в редьюсере мы пишем сами (например initialState). И в зависимости от type меняем его...

Как убрать warning React.forwardRef?
Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()? Эта ошибка появляется там где есть мой компонент Input с такими...

Удалить пробелы методам trim()
Здравствуйте подскажите пожалуй как реализовать. Есть input Добавления тегов и кнопка, нужно с помощью метода trim() сделать так чтобы если инпут содержит пробелы я не мог нажать кнопку добавить...

При выполнении задания(при клике) удаляется совсем другое задание, только в визуализации
Здравствуйте. Когда я кликаю(на кнопку Выполнено) на любом задании, почему-то всегда удаляется последнее задание, хотя в консоли всё правильно происходит. При перезагрузки страницы всё становится на...

Проблема с Redux DevTools
Не знаю если в правильной месте задаю вопрос, но проблема с расширением для браузера Redux Devtools, пару недель назад пользуясь этим расширением я на что то нажал, и теперь все что я вижу это...

Как экспортировать функцию из класса?
Как экспортировать функцию (resolveFileNameWithType), которая находится внутри класса? Если вынесу за пределы класса, то аргумент type теряется. export class DownloadReportComponent extends...

ReactJS: Установка проекта
Здравствуйте, я только начал изучать ReactJS и хотел бы разобраться с реальных примеров. Подскажите, как установить проект? Я выбрал этот, но не знаю, как его установить. ...

Mobx не загружается в проект
Доброго времени суток. Начал  изучение mobx, пытаюсь установить п проект npm i mobx-react-lite выдает ошибку! Может кто то сталкивался, помогите плиз! Ошибка выглядет так npm ERR! code ERESOLVE...

Как грамотно сказать кнопочке, к какому элементу списка она принадлежит?
Компонент берет в пропс массив и через .мап создает список, каждый элемент списка содержит форму с двумя кнопками, которые должны влиять на определенное значение массива. ПРИМЕР: (ли1 знач мас 1...

Проблема с отображением результата запроса
Добрый день! Перейду сразу к сути. У меня есть готовый API от imdb. Делаю цикличный запрос, сохраняю каждый результат запроса в state. Показываю результат по шаблону. Но проблема именно в последнем. ...

Отображение несколько видео на странице
Всем привет! Пытаюсь добавить несколько видео друг за другом на одну страницу import VideoPlayer from 'react-video-js-player' ... <div className="Test_Video"> <VideoPlayer ...

Индекс "нажатого" элемента
Делаю элементы, при клике меняющие стиль. Вот код index.js class App extends React.Component { constructor(props) { super(props); this.handleClick = this.handleClick.bind(this); ...

Не обновляется компонент при setState (JS React)
Есть массив в стейте, он копируется в masdop, после чего обновляется пушем, и юзается сетСтейт, почему не происходит отрисовка согласно изменению стейта? //Конструктор var tkJSON2 =...

Правильно ли я написал функцию "reducer"?
Здравствуйте, правильно ли я написал функцию "reducer"? (ст 22) <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" ...

Bootstrap сработал до того как его "попросили"?
Здравствуйте! В этом учебном проекте используется react и bootsrap. Почему до того как мы задали className элементу Bootstrap уже включился и применил свои стили(смотрите первый и второй скрин)?...

Получение ссылки на DOM для компонентов material-ui
Всем привет. Подскажите такой момент. Есть компонент SELECT из материал, я сделал выбор в списке и хочу потом получать выбранное значение не записывая в стейт, а вынимая его из DOM. То есть брать с...

Мониторить один из чатов в телеграме, при поступлении сообщения отобразить его и проиграть звуковой сигнал.
Стоит такая задача: нужно мониторить один из чатов в телеграме, при поступлении сообщения в этот чат, необходимо на компьютере отобразить сообщение из чата и звуковой сигнал проиграть.

Можно ли сделать контроллер на манер фреймворков?
Можно ли сделать контроллер на манер фреймворков(laravel,yii2)? Просто пока кажется, что придётся все урл на компоненты завязывать. const AppRouter = () => ( <Router> <div> ...

React-native студенческий проект
Всем привет! Ищу разработчика для совместной разработки нашего мобильного приложения (можно сказать студенческий проект). Пишите кому будет интересна эта тема, чтобы поделиться опытом и...

Как начинать с того шага на котором остановились в input range?
Добрый вечер, подскажите алгоритм сохранения шага в input range, чтобы при повторном движении у нас учитывался предыдущий шаг. То есть если вести мышкой по высоте блока вверх или вниз у нас меняется...

Пререрисовка таблицы после изменения состояния
Доброго времени суток! Есть таблица, в которой есть данные о товаре, которые хранятся в localStorage. При нажатии на крестик происходит удаление, массив в localStorage уменьшается, но перерисовки...

Как делать запросы из react к базе ms sql если проект на ACP NET?
Есть проект C# ACP NET, в котором фронтенд будет переводится на react.js. До этого использовался Entity Framework. Как делать запросы из react к базе ms sql?

Теги <select> и <option> Выпадающий список
Доброго времени суток. Хочу реализовать, что-то вроде таблицы, которая будет состоят из трёх столбцов и тут же есть выпадающий список, в котором есть выбор, по каким параметрам сделать сортировку: по...

Переделать export default в export
Добрый день. Помогите переделать export default в export import {connect} from 'react-redux'; const test = () => { console.log('Test1'); } const test2 = () => { ...

Как копировать файлы которые собирает webpack?
Webpack сделал сборку файлов bundle.js (Home profile shop) на локальном диске. А мне нужно эти файлы положить на наш внутренний сервер в 2 папки /dev_1/ /dev_2/ То есть попросту...

Выбор даты в React Data Grid
В таблицу React Data Grid в колонку с датой надо добавить выпадающий календарь для выбора даты. Пробовал прикрутить в качестве editor-a React DatePicker, но он не подходит видимо.

Как вывести значение в DOM которое ожидается в промисе?
Здравствуйте, как вывести значение в DOM которое ожидается в промисе? Причина ошибки мне понятна, но я не знаю как вывести в дом значения функции trueMessage. Подскажите пожалуйста что делать в...

Не работает синтаксис мутации в "createSlice" Redux
Здравствуйте, не работает синтаксис мутации в "createSlice" Redux. Вот к примеру (38 - 41ст) кусок рабочего кода(когда нажимаете на хрестик удаления задания, то выполняется этот кусок), но состояние...

Таймер обратного отсчёта
React-компонент - таймер обратного отсчёта. Компонент должен работать по следующему алгоритму: На экране представлено специальное текстовое поле и кнопка «Начать!»; Пользователь вводит...

Парсинг ссылок в чате
Всем привет! Как можно реализовать парсинг URL (например из сообщения) в кликабельную ссылку и при этом не использовать dangerouslySetInnerHTML?

Инициализация state в Redux
Доброго времени суток. В своем проекте я использую Redux, и метод reducer(). Как правильно сделать "предзагрузку" данных в initialState? Я имею в виду общий подход. В приложении есть: const...

Почему не обновляется переменная
Мне нужно доделать проект, который был написан с помощью mobx. У меня почему-то не обновляется значение переменной (value={state.backOfficeTable1.description.currentMonth}) как в обычной useState,...

Фильтр через query params
Прошу поделится какой-нибудь статьёй, или решением как можно сделать фильтр фильмов или вообще любой фильтр, чтобы в строке браузера показывалось что-то такое...

Проблема с UseEffect. Выполняется несколько раз при рендеринги странице
Здравствуйте, недавно начал разбираться с React и столкнулся с такой проблемой, что при использовании useEffect страница отрендеривается 2 раза. Возьмем к примеру одну из страниц. import React,...

Параметры url в rescr-router-dom
Здравствуйте. Подскажите пожалуйста. Изучаю react-router. Всё было славно пока не дошел до url в формате /что-то тут (например, mysite.ru/about/34). Не работает. Роутится на стороне клиента. ...

Навигация по элементам в React
Добрый день! Интересует такой вопрос: раньше я работал с приложением для SmartTV на AngularJS, для навигации использовалась эта библиотека: ...

Redux передача своих пропсов
class CasesContainer extends React.Component { filterAndSort() { let arr = this.props.casesInfo.map((elem,index) => { return <Case key={index}/> }); return arr; } ...

Проблема с шириной столбцов в Ag-grid
Можно ли как-то сделать так, чтобы столбцы растягивались до конца без белых пустот как на изображении? Или же как-то динамически их растягивать?

Как вывести ключи и значения массива в HTML элементах?
Реализовать компонент, который будет принимать один параметр в формате JSON и отображать вложенный список. Пример конфига: { “item1”: { “nestedItem1”: null, “nestedItem1”: { ...

Страница требует refresh после перехода по ссылке
Здравствуйте, уважаемые форумчане! Никак не могу решить проблему, описанную в заголовке темы. Вот код: import React, { PureComponent } from 'react'; import {Switch, Route} from...

React.createClass is not a function
Добрый день! Нужна ваша помощь! Установила пакет gulp и в него react, babel. var container = document.getElementById('container'); ReactDOM.render( <div> <h1>Заголовок</h1>...

Данные в массив сохраняются два раза вместо одного
import { StatusBar } from "expo-status-bar"; import { useEffect, useRef, useState } from "react"; import { StyleSheet, Text, SafeAreaView, Image, Button, TextInput, } from...

Передача объекта в react
Не могу разобраться с массивом объектов. Пытаюсь передать массив объектов в дочерний элемент, делаю так state = { rightAnswers: false }; outAnswers = (q, a) => { const...

Парсинг файлов
Я плохо разбираюсь в React, но мне необходимо сделать парсинг одного типа файлов. для этого я создал в компонент для загрузки файлов <input type="file" onChange={ (e) =>...

Axios post ошибка 415
Всем привет. Пишу post запрос на регистрацию и у меня всё время ошибка 415. Как её решить? Я с ней сижу уже 2 дня и нечего не пойму. Вот мой код: import React from 'react'; import axios from...

Вызов fetch из реакт приложения через proxy
Друзья, может кто-нибудь по шагам пояснить последовательность действий, чтобы с локальной машины я мог делать post запросы на сторонний сервер через proxy? Запросы необходимы к адресу...

Как импортировать CSS из JSON в React?
С сервера в JSON приходят данные: { "A": { "cell": 5, }, "B": { "cell": 10, },

Добавить элементы на страницу
Всем привет! Только вчера начал осваивать react js и не могу разобраться, как добавить сразу несколько элементов на страницу. То есть есть код, который выводит карту и отмечает на ней точки из json...

Как ограничить количество цифр после запятой js?
Помогите пожалуйста ограничить количество цифр после запятой! <p className="Card-Click-dis">{item.price * item.count / 100 * 10} ₽</p> Идет такой подсчет, что цена умножается на количество и...

setInterval не вызывает функцию
Добрый день. Не могу победить кусок: function gameOn () { timerId = setInterval(pressCell, delay); }

добавить к ссылке при onClick сообщение alert
Решаю учебную задачу и почему-то никак не выходит прикрутить к onClick сообщение. Подскажите пожалуйста, кто знает хоть как примерно это сделать. Чего-то я совсем запуталась... import...

Вынести логику из компонента
Столкнулся с интересным вопросом, что делать , когда внутри компонента необходимо провести некоторый алгоритм, результат которого после в компоненте вывести? function Welcome(props) { const...

Как вызвать перерендер компонента при изменении store?
Всем привет. У меня не есть самостоятельная реализация redux (разбираюсь с чужим кодом). И у меня возникла следующая проблема. https://codepen.io/gsdev99/pen/pYqmRr Когда в reducer...

Приложение не загружается
Доброго времени суток! Я пока только начинаю изучать React и столкнулся со следующей проблемой... Приложение не загружается на локальном сервере... Наверное компоненты моего проекта не...

Стилизация динамической верстки
Доброго времени суток! Пытаюсь сделать следующее: есть такие данные для формирования объекта: строка с уже готовой версткой: "<div id="test">test markup</div>" объект со стилями: { fontSize:...

Выдает ошибку
подскажите пожалуйста что делаю не так ? только начал изучать React Native JS есть два файла № 1 App.js import { StatusBar } from 'expo-status-bar'; import React from 'react'; import {...

Перерисовка одного элемента списка, а не целиком
У меня такой вопрос: Есть список в стейте. Через map вывожу каждый элемент. Меняю значение одного элемента (копирую стейт, меняю одно значение и возвращаю объект через setState) и получаю ререндер...

Назначение this.props.children в фрагменте кода
Никак не могу разобраться что делает и зачем в коде this.props.children и что оно делает. Понял лишь что без него дочерние компоненты не загружаются на страницу уже пару ресурсов перечитал и...

Аналог hover css на react
Добрый день! У меня несколько блоков одного класса, формирующихся в цикле. Подскажите, как мне сделать, чтобы при наведении мыши у меня применялся стиль, только к конкретному блоку? Сейчас...

Redux-saga
У меня есть файл с API запросами на локальный сервер import * as axios from "axios"; class Api { constructor() { this.instance = axios.create({ withCredentials: true, ...

Ежедневник на react native
Думаем как сделать ежедневник в приложении, надо ли верстать все элементы, типа чисел календаря с попапами событий, которые должны в них произойти или есть какие плагины календаря/ежедневника,...

react-yandex-maps проблема с balloonContent
добрый день. не получается вывести описание для точек на карте, перерыл весь интернет, все найденное не отрабатывает. вот фрагмент кода: <div style={{ width: "80%", height: "100vh", marginLeft:...

Не получается запустить приложение реакт на сервере Ubuntu
Доброго времени суток друзья. Впервые столкнулся с такой проблемой, на локалке приложение хорошо работает компелируется, Но как переношу на vps выдает ошибку Failed to compile. ...

React-router не отрисовывает компоненты
У меня есть код, который берет данные из API товаров и отрисовываю их. Кроме пытаюсь сделать переходы между страницами. Но есть проблема. Когда пытаюсь сделать переход на каждый отдельный товар,...

Redux изменение состояния
Добрый день! Скажите, как можно изменить состояние (initialState)? Можно ли это сделать с помощью .push() или ка-то по-другому? Но при использовании .push() браузер выдает ошибку, что это не функция...

Правильное отображение данных при сортировке
Всем Привет! Кто может подсказать как правильнее мне применить мою сортировку в React. У меня есть список данных которые я получаю из Firebase books1 они изначально отображаются друг за другом в...

Работа с Redux-form
Доброго времени суток. Помогите понять ("прощупать") как попал объект с данными собранными из form в качестве аргумента formData функции onSubmit? p/s Пожалуйста, не пишите, что redux-form...

Изменение state
Здравствуйте, столкнулся с такой проблемой: Есть компонент App, внутри которого есть state.value. Нужно c помощью компонента Child при нажатии в нем на условный элемент (div,p и т.д.) изменить...

Превратить однострочный код в многострочный
Есть файл comment.react.bundle.js, где писали код и сделали его в 1 строку. Можно ли его как-нибудь, с помощью программы, сайта или чего-либо еще, не расставляя переносы вручную, превратить в...

Как отрендерить объекты в объекте?
Есть объект obj, в нём объекты, они буду создаваться динамически, по клику, например будет так const obj = { id: { id:1, bla: "flerflkewfl" } }

Как работает useRef()
function Counter() { const = useState(0) const prevCountRef = useRef(); useEffect(() => { prevCountRef.current = count }) const prevCount = prevCountRef.current

JS React обновление классового компонента
Следующая ситуация: при рендере классовый компонент реакта получает на вход параметром массив. Один из методов класса добавляет в этот массив элемент, как перерисовать компонент с учетом изменения...

Изменяю state но компонент не рендерится!
Приветствую Знатоки! При изменении массива не рендерится компонент <TaskPanel />, сильно не пинайте я только вливарекчусь :) file App.js import React from "react"; import Header from...

React.js Переполнение стека
Добрый день. Есть код для создания простого списка, пункты которого помещены в массив: export default class Menu extends React.Component { constructor() { super(); this.state = { ...

[React] Как правильно получать components с сервера?
Есть проект. Он старенький. Расчёт идёт на то что бы перевести его с сервер-сайд рендринга, на фронт-сайд... Сейчас он работает на react и .net (mvc\web api) Чтобы полностью переехать с mvc на web...

Не работают хуки
import React, {useState} from "react"; function App() { const =useState(0); function incr() { setСount(count +1); } function decr() {

React, Json сравнение
добрый день, возникла проблема не могу второй день решить. есть два Reduces, один отвечает за данные для магазина, другой за данные для вкладки популярные. Во вкладке популярные есть кнопки на...

Вопрос по Выражению. Подскажите, пожалуйста, что за определение компонента: { logout }?
Привет, подскажите пожалуйста, что за определение компонента такое: const Logout = () => ( <AuthConsumer> {({ logout }) => ( <button className="btn btn-sm btn-default"...

Верхнее меню c правой стороны на antd
Привет всем пытаюсь создать навигацыонное меню с правой стороны на ant desin библиотеке. В документацыи ни одного примера с меню на правой стороне. Приведу пример кода: <Menu...

Компоненты не перерисовываются после изменения состояния Redux
Здравствуйте. Я пытаюсь составить список дел. Я взял UI из примера Redux и начал писать логику по-своему. Я столкнулся с проблемой. Итак, проблема в том, что когда я нажимаю кнопку «Mark All...

react-router-dom не работает
Решил разобраться с роутингом, но столкнулся с преградой App.js import Nav from './components/Nav'; import {Route, Router, Routes} from 'react-router-dom' import Home from './pages/Home'; ...

Получить ссылку на DOM элемент из списка SELECT material-ui
Приветствую. Такой вопрос. Есть элемент SELECT из материала, хочу при отрытом выпадающем списке получить доступ к дом элементу этого списка. Я получил доступ, но на мой взгляд решение какое-то не...

Изменить стейт родителя без родительского обработчика
import React, { Component } from 'react'; import { Child } from '../..'; class Parent extends Component { state = { values: '' }

Mobx strict mode
Добрый день, объясните, пожалуйста, почему выходит предупреждение Since strict-mode is enabled, changing (observed) observable values without using an action is not allowed. Tried to modify:...

А вот как можно реализовать тамагочи на React, canvas (данные сайта хранятся в mongodb)?
Подкиньте пожалуйста идей,если можно. Делаю сайт,хочу добавить туда тамагочи. На данный момент есть двигающийся персонаж в канвасе на фоне,меняющимся в зависимости от погодных условий. Хочу добавить...

Как правильно организовать работу с ролями в react/redux приложении?
В приложении есть роли(admin, manager, user и т.д.) у всех разный набор разрешений. На бэке все замечательно разрулил. Не могу понять как в redux приложении организовать всё. Как должен быть...

Где лучше писать "css" код в "React"?
Как задавать стили в React через className или через style={}? Что лучше?

Вывод списка документов в виде таблицы с полями
Нужно с C++ переползать на REACT и Java скрипты По работе такое задание https://github.com/bystrobank/react-test-app PS Пожалуйста

Как отрендерить даные полученные localhost:3001
Имеется компонент React , который через fetch получает данные с http://localhost:3001/db_datas mport React from 'react' import InvoiceItem from './InvoiceItem' class Invoices extends...

Как добавить название изображения из массива?
const ImgBlock = () => { const imgs = ; return ( <div className='imgBlock'> <img className='ch' src='img/{imgs}' alt="test" /> </div> ); }

Нахождение площади треугольника равнобедренного (или равностороннего)
Подскажите, как можно было бы указать формулу, если нужно будет найти два треугольника на выбор. const = useState("r="); // нужно будет указать несколько констант для сторон треугольника? ...

Запускаю простенькую страницу ошибка 404
Сижу с ubuntu 22.04,, 3-й день пытаюсь сделать сайт до этого получилось написать простой фронт как задание. Прошло 2 недели и чтобы я не пытался запустить ошибка 404 не понимаю что делать. Исправил...

Замена значений в Redux
Добрый день. Пытаюсь сообразить, правильно или не правильно делать так: case 'HANDLE_SET_DISPLAY_VALUE': let newnumber = state.calculator.number; newnumber = 5 ...

Как переделать функциональный компонент в классовый?
import React from "react"; import { useState } from "react"; const Cart=({name,img,price,addProduct})=>{ const =useState(false) const onClickPlus=()=>{ setIsAdd(isAdd) ...

Сайт запускается из под корневой папки
Запускаю проект через npm start, на страницу выводится ошибка "Unexpected Application Error! 404 Not Found ������ Hey developer ������ You can provide a way better UX than this when your app...

Ошибка 404 при обновлении страницы, React router
Я в своем сайте использовал react-router-dom и у меня выскакивает ошибка при обновлении второстепенных страниц. Подскажите в чем может быть дело. Я полагаю что в где-то в роутере. Ошибка 404 Page...

Как передать пропсы в children корневого layout Next.js
Добрый вечер! Вот корневой layout.js в Next.js: export default function RootLayout({ children }) { return ( <html lang="en"> <body> <Navbar /> {children}...

Работа с массивом
Добрый день, я новичок в JS, react. В компоненте Test , я получаю через GET-запрос список с элементами id,x,y. Затем это все заносится в массив elements. Проблема вот в чем, я хочу написать функцию ...

Доступ к свойствам объекта
В музыкальном сервисе last.fm необходимо получить список популярных треков ("name"). При обращении к данному свойству я получаю ошибку "TypeError: Cannot read property 'track' of undefined". Понимаю,...

TypeError: Cannot read property 'map' of undefined
import React from 'react'; import TodoListItem from './todo-list-item'; const TodoList = ({todos}) => { const elements = todos.map((item) => { return ( <li...

Где можно найти шаблоны простеньких сайтов аля сайт визитка
Подскажите где можно найти шаблоны простеньких сайтов аля сайт визитка

Использование аргументов функции в setState
onAnswerClickHandler = index =>{ if(index === 0){ this.setState({ answer: {0: 'good'} }); this.componentDidMount() }else { ...

JSON объект распознается как пустой массив
Добрый день, форумчане! При попытке переслать с бэка объект JObject от Newtonsoft на фронт я вижу на бэке, что он выглядит как { "properties": { { "prop1":"1", ...

Не изменяется state
Здравствуйте! Не могу понять почему не отрабатывает this.setState() при вызове функции. Вот код: constructor(props){ super(props); this.state = { posts: , loading: false, ...

Формы Реакт
Есть вопрос у меня. Alert у меня считывает все кроме pass. В чем моя ошибка? import './App.css'; function App() { let onSubmit = (e) => { ...

Динамический импорт внутри index.js
Здравствуйте! Подскажите, пожалуйста, как я могу импортировать разные файлы index.css в зависимости от условия (переданного контекста переключения языка)? Файл index.js import React,...

роуты в реакте
Всем привет когда нажимаю на ссылку, в адресной строке постоянно добавляется "account". Если нажать один раз на ссылку "Личные данные" будет адрес - "http://localhost:3000/account/data", но если...

WordPress и React
Вообщем такой вопрос)) (если что, я пока начинающий фронтенд разработчик, не сердитесь=)) Мне нужно сделать сайт для ресторана. Писать я его буду на реакте. Нужно реализовать возможность...

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

Ошибка при загрузки файла net::ERR_INVALID_URL
есть картинка <img src="data:image/png;base64,...

Как передать данные из одного компонента в другой
Подскажите как передать данные из одного компонента в другой. Читал документацию но плохо понял можете показать легкий пример. На фото указал как хочу чтобы было.

Как использоваться useCallback чтобы при вызове функции не вызывался рендер?
Есть функция let = useState(''); const changeValue = useCallback(e => { editValue(e.currentTarget.value); if (e.key === 'Enter') { props.addTask(generateId(),...

Утечка памяти при удалении компоненты с таймером
Здравствуйте, уважаемые форумчане! Работаю над проектом в котором сейчас уже много всего, но столкнулся со сложной для меня проблемой (я недавно начал изучать ReactJS). Проблему изложил в трех...

Запрос axios
Здравствуйте, при запросе на сервер к базе данных, показать строку где id = userId сервер падает и выдает следующую ошибку throw new Error(`WHERE parameter "${key}" has invalid "undefined" value`);...

Render компонента из строки
Доброго времени суток! :) Возможно ли средствами React или какими-то модулями выполнить render компонента, например: из "<ComponentTest />" в <ComponentTest />. Т.е. компонент обернут в строку. ...

Страница not-found не отображается в next.js 14
const NotFound = () => (<div style={{color:'skyblue'}}>n o t f o u n d</div>) export default NotFound в папке app,как и всё остальное. не работает почему? Добавлено через 3 часа 20 минут...

Как правильно обернуть React ом существующую верстку
Рассматриваю для принятие на вооружение React (на данном этапе сравниваю с vue). Использоваться будет только на отдельных страницах сайтов. (как пример: формы со сложной логикой). На одном из...

Можно ли в реакте как то дополнить объект в стейте?
доброго времени суток, подскажите пожалуйста, есть стейт, в нем лежит некий объект state = { object: { key: value } } и есть несколько компонентов, которые должны в объект...

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

Структурирование данных для отображения
Приветствую формучане, запутался в написании правильной структуры JSON файла с данными, которые я хотел бы отобразить, а возможно он даже и не нужен, но пока не могу прикинуть как правильно...

Routing react-router-dom
Здравствуйте столкнулся с проблемой при создании дочерних страниц вот так вот делаю Route <Route path="/category" component={Category}/> <Route path="/category/editing"...

Нужно ли знать фреймворк "Jest" для "Front-end developer (react)"?
Здравствуйте, нужно ли знать фреймворк "Jest" для "Front-end developer (react)"? Насколько хорошо?

Не обновляются пути у изображений через state
Создаю сейчас "переключатель" изображений. При клике на одну из "secondary" фотографий, она меняется местами с "main" фотографией. В state элементы вроде как заменяются, но новые пути для изображений...

Получение состояния элемента при клике на него
У меня есть список элементов с датам суммами и т.д. Нужно сделать так, чтобы при клике на нем можно было получить, к примеру, его id, а затем этот id передать в экшн. Как это сделать? И как сделать...

Как реализовать на клики не авторизованным пользователям
{ state.auth ? <Switch> <Route path='/' exact component={Home}/> ...

Анимации в React на JQ?
Всем привет! Пишу проект на React в котором большое количество анимированных элементов. Как лучше анимировать их средствами JS? Можно ли подключить JQ в React и работать на нем? Как один из...

Логика в useReducer
Всем привет! Не могу разобраться с логикой редьюсера. Логика такая. Если хоть один свитч1...3 активный, то и generalSwitch активный, но как сделать чтобы еще и работало наоборот? (тоесть если...

Контейнерная компонента
Финальная цель - реализовать тоже самое что и на https://todoist.com в разделе "сегодня". Если кратко, добавляем задачи, добавленные задачи можно удалять и изменять(при нажатии на задачу она меняется...

Redux. Регистрация состояние стора, исходя из композиции компонентов
Уважаемые форумчане, помогите пожалуйста понять, как правильно реализовать задачу, которую одна компания дает на своих технических интервью. Суть проблемы: нужно сделать программу, на подобии todo...

Где можно взять свободные API данные для поиска отелей по названию города
Нужно сделать приложение в React по поиску отелей по названию города, не могу найти API данные, чтобы делать get запрос. Нужно вывести название отеля и картинку, а также на первой странице вводится...

Отправка в браузер React файла с сервера Node js
Возможно ли отправить большой React файл в браузер через node js? я нашёл примеры отправки простых файлов реакт через babel html: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> ...

Всегда проблемы с роутерами. Ни один роутер не принимает детей
И роутеры из react, и из react native. Выдаёт ошибку: TS2559: Type '{ children: Element; }' has no properties in common with type 'IntrinsicAttributes & IntrinsicClassAttributes > & Readonly '. ...

Формы в Production режиме (react-scripts build)
Всем день добрый, Ищу помощь коллективного разума. Есть приложение на Реакте. Все работает как положено и ожидаемо в Дев режиме; при компиляции в Production, банальная обработка форм не работает. ...

Env в create-react-app
Добрый день, В проекте использую create-react-app. В качестве хоста для проекта использую gh-pages. Адрес на gh-pages такой ... .io/constructor/.... в js указываю для путей...

Зависимости create-react-app
При создании react приложения командой create-react-app app внутри /app создается каталог node_modules - на 200 mb всякой всячины. Наверно, там все нужное. Но можно ли сделать, чтобы этот каталог был...

Считывание данных из локальной CSV таблицы
Здравствуйте! Такая проблема - никак не могу понять как правильно считать данные с таблицы, чтобы было без undefined... Иначе, при переключении на страницу с этим компонентом, состояние dataCSV...

React native
Всем ку , есть проблемка уже час сижу не могу понять в чем проблема . Вообщем нужно установить react native cli на мак , все скачал , node и watchman тоже установил , крч все сделал как на сайте по...

Как можно менять параметры уже размещенных компонентов?
Я хочу создать модальное окно, компонент в котором можно было бы выводить сообщения. Например: class Modal extends React.Component { constructor(props) { super(props); } ...

Как в JSON добавить теги html или svg?
Подскажие как можно в JSON файл указать html элемент или svg? Я указал так: { "id": "1YQ159", "buttons": { "add": "<div>➕</div>", "favorites": "<div>❤</div>"...

Значения из инпутов, добавить в конец массива.
Доброго времени суток. Помогите пожалуйста закончить задачу. Нужно значения из инпутов, добавить в конец массива. Вот, что смог написать, const ListCars = const ShowItem = () => { let...

Zoom изображений при обрезке фото
Добрый день, нужно сделать, чтобы юзер мог зумить изображение жестами с телефона во время обрезки фото Может быть кто сталкивался и делал, либо если есть полезные ссылки, то поделитесь пожалуйста ...

ReactJS Function is not defined
src\Second.js Line 33:92: 'myAdd' is not defined no-undef Line 34:91: 'myVivod' is not defined no-undef Line 41:87: 'myAdd1' is not defined no-undef Line 42:86: 'myVivod1' is...

Строка в переменной не распознается require
Добрый день! Подскажите, пожалуйста. Передаю в функцию стили и путь к изображению. Но возникает странная ситуация, если пытаюсь получить image2, то возникает ошибка "Error: Cannot find module...

Вытащить результат переменных из функции
Приветствую формучане, подскажите как мне из функции test() вытащить полученный результат переменных res4 и col, на 34 и 36 строке чтобы продолжить с ними дальше работу со 127 строки. Ведь я их...

Как сделать, чтобы текущая дата в DatePicker (material-ui) автоматически обновлялась?
То есть если страница открыта в браузере в момент смены суток.

Uncaught ReferenceError: render is not defined
Приветик всем, у меня возникла ошибка. не могу запустить начальную обычную программу, только начала изучать. ищу в интернете не могу найти или что то не понимаю. Объясните пожалуйста. import...

Нужно ли удалять проверку типов "PropTypes"?
Здравствуйте, вот допустим есть какой-то код и есть проверка типов "PropTypes" Всё прекрасно работает, только у меня вопрос возникает. Нужно ли удалять строчки кода которые отвечают за проверку...

Доступ к ownprops из store - react-router-redux
Здравствуйте! Предисловие: очень большой проект написан мною на ReactJS (в пакете create-react-app), недавно было принято решение прикрутить Redux т.к. поддержка стала невыносимой. Изначально...

Как применять ReactJS?
Здравствуйте изучаю React все понял но как его натянуть на сайт с таким HTML? Да и в каких случаях его использовать и как? <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN"...

Массив объектов в конструкторе
Всем добрый вечер! Только начал работать с React, прошу вашей помощи. Есть вопросы с вариантами ответов (может быть как один правильным так и несколько). Нужно в переменной currentValues, которая...

Имеет ли смысл использовать Next.js в большом проекте?
Имеет ли смысл использовать Next.js в большом проекте? И если да, то в каком случае. Есть ли минусы его использования?

Выполнить проверку при загрузке страницы
Есть приложение. В элемента есть конечная начальная. Буру текущую дату, сравниваю с конечной и меняю фон (если, например, дата больше финальной, то красный цвет). Работает только при клике. Как...

React и вывод елементов
Я беру ресурс и вывожу данные через fetch. Дело в том, что у меня выводятся сразу все элементы с моего ресурса. Есть вопрос, как сделать так чтобы элементы показывались как в интернет магазине:...

Вызов родительской функции с параметрами из функции в компоненте
Доброго времени суток ув. фоурмчане по немногу пытаюсь освоить реакт и столкнулся с вот такой проблемой. имеется компонент App в state которого хранится token так-же в нем есть ф-я авторизации,...

Почему в функцию постоянно передается значения "false"?
Здравствуйте, почему в функцию постоянно передается значения "false" если должно передаваться значения "true"? ст 47, в аргумент truths должен передаваться true, но там почему-то false. Подскажите...

React Unit Test общее представление
Добрый день. Появилось немного свободного времени и я пытаюсь разобраться, что суть есть тестирование в React. Сейчас читаю вот это https://ru.reactjs.org/docs/testing-recipes.html Там приводятся...

Научиться работе на React
здравствуйте, не так давно решился разобраться в библиотеке или фреймворке react js и столкнулся с тем, что во всех туторилах или видио на ютубе все начинается с настройки node пакетменеджеров babel...

react-draft-wysiwyg на хуках
Не могу найти нормальный источник по использованию react-draft-wysiwyg на хуках. Не могу разобраться c editorState и onEditorStateChange.

Как правильно сделать валидацию через react hook form?
Есть два input <input type="number" name="first" /> <input type="number" name="second" /> Как сделать валидацию что бы во втором input число должно быть 100% больше чем в первом, с выводом...

Как отправить динамическую форму в axios
Добрый день!!! Есть динамическая форма: <h1>Add Stage</h1> <form className={classes.root} onSubmit={handleSubmit}> {inputFields.map((inputField, index) => ( ...

Проблемы с setState при считывании данных с сервера
Здравствуйте, только начал изучать react, пытаюсь с базы загрузить информацию себе в приложение. Вроде бы делаю всё правильно, class App extends React.Component { constructor(props) {...

Uncaught Error: createRoot(.): Target container is not a DOM element
В чем может быть проблема? id написал верные (В html разметке они такие же). До этого рендерился products без проблем, добавил reviews и появилась ошибка в браузере Uncaught Error: createRoot(.):...

Как изменить стиль JedWatson react-select
https://github.com/JedWatson/react-select Использую этот пакет для реализации select <div className="selectClass"> <Select ...

Как сделать кнопку лайк для поста React Redux Firebase?
Доброго времени суток! Как сделать кнопку лайк для поста React Redux Firebase?

Изменение ссылок разработчика на корректные после сборки
Всем привет! Разрабатываю Frontend на ReactJS и Backend(REST API) на web api asp.net. При разработке данные от Backend запрашиваю посредством конструкции: await...

React document.getElementById
Добрый день. Подскажите, могу ли я пользоваться document.getElementById при разработки react приложения? Кто-то говорит да, кто-то нет, не очень понятно, но у меня получалось обходится и без этого....

Ререндер родителя обёртки при изменении в дочернем компоненте
Добрый день. Происходит ререндер родителя-обёртки при изменении в дочернем компоненте. Хотя мне это не нужно. <div id="root"></div> const Page = ({ children, title }) => { console.log("Page...

Отслеживание изменений в форме
Доброго времени! Есть форма, на которой 30 инпутов разного рода. Стоит задача о контоле изменений в каждом поле. Т.е. изменили возраст - подсветилась кнопка, на оснвании какого то состояния. На...

Посоветуйте уроки react для начинающих
Здравствуйте. Посоветуйте, пожалуйста уроки по react для начинающих. К примеру создание первого приложения в visual studio code. Что-то совсем для начинающих.

Как менять пропс по условию?
Всем привет, пожалуйста помогите с вопросом Нужно по наведению мыши (onMouseOver) изменять пропс Paper на значение 3 и обратно, если мышь убрали (onMouseDown) <Grid item xs={12} sm={6} md={4}>...

package.json что должно быть в dependencies а что devDependencies
Добрый день. Пишу приложение при помощи React, делал package.json руками (не через creacte app) Закидывал всё в devDependencies Сейчас файл имеет следующий вид: { "name":...

Запуск npm run build
Здравствуйте, уважаемые форумчане! Пытаюсь запустить build на указанном домене. Раньше, когда использовал npm start делал так: HOST=domain_name npm start и сервер стартовал по указанному домену. ...

Позиционирование кнопки по правому краю ReactJS + ChakraUI
День добрый! Что-то никак не могу выравнять элемент по правому краю. Использую React в связке с Chakra-UI. Можно по-идее написать функционал для вычисления нужного Margin'a, но даже как по-мне ,...

Насколько распространены такие подходы ("паттерны")
Всем привет. Встретил некоторые паттерны (конечно, таковыми их можно назвать с натяжкой). Хочу узнать, в реальных (а не учебных приложениях) насколько они считаются хорошей практикой. 1)...

Странность с использованием хука состояния
Изучаю react, изучаю сейчас хуки. Вот такой компонент, всё работает как надо: function MyComponentWithHooks() { let = useState( ); let answer = useRef(null); let num1 = useRef(null);...

Получение данных из массива
let m = При выводе результатов на экран получаю: ВасяФедяПетя. Как результат разбить на отдельные строки?

Асинхронность setState
this.state.error={text:'true',date:'false'} errorFunction = (prop) => { let arr = {...this.state.error}; arr = false; this.setState(() => { return {error: arr} }) };...

Не ререндерится "Display Panel" при клике на кнопке в "Control Panel", почему?
Здравствуйте, когда происходит клик по синей кнопке "Add" изменяется состояние "tasks" в файле TasksProvider.jsx, это видно в консоли, но почему то нету рендеринга в компоненте...

Наследование state
Можно ли унаследовать this.state у класса? и как это сделать. Пример class Example extends Component { constructor(props) { super(); this.state = { param1: ...

Каким способом можно изменить дублирование id товара, если их несколько одинаковых добавилось, а удалить надо 1
const Cart = (props) => { debugger let elementsCart = props.cart.cart.map((c) => { return <div> <h3> <li >{c.name}</li> </h3> ...

Не рекомендовать некоторые объекты
Добрый день. Есть страница с рекомендациями некоторых товаров. Выводятся по 3 штуки. Всего их много но некоторые из них надо убрать из списка рекомендованных чтобы они не выводились. Не подскажите...

React Router Lazy load Chunks
Как настроить динамическую подгрузку модулей при переходе между разделами приложения?

Как на функциональных компонентах написать страницу фильтрации через get запрос
Как на функциональных компонентах написать страницу фильтрации через get запрос для учебного макета сайта недвижимости? Те подбираем квартиру по параметрам city, rooms, price и вешаем везде...

Данные SQL запросов в Реакт
Друзья, добрый день. Подскажите, пожалуйста: приложение работает одновременно с большим количеством наборов данных (результатов SQL-запросов к БД). Есть несколько Мастер-запросов, есть их Детали,...

Как переиспользовать компоненты в react native
Я уже и не надеюсь, но вдруг именно здесь смогут помочь. Разрабатывая приложение столкнулся с проблемой, в процессе работы приложение обращается к серверу и получает некоторый массив, далее...

Получение данных API и обновление Redux
Написал опросник, который при загрузке станицы сразу грузит вопрос из API, функцию загрузки вопроса запускаю в componentDidMount(), как теперь в Redux сделать тоже самое, чтобы вопрос загружался при...

Вывести Object.assign объект в консоль
Есть редьюсер с начальным состоянием, и нужно вывести в консоль новое состояние, созданное с пом. Object.assign(). Как это можно сделать? С console.log? Но как именно? export let initialState = {...

Webpack независимые сборки
есть структура node_modules/ package.json folder1/ webpack.config.js jest.config.js tsconfig.json

Куда выносить логику функциональности компонентов?
Здравствуйте. Знаю что в компонентах не должно быть много логики, необходимо ее выносить в Services или в hooks. Как определить куда?

Создать Sidebar
Нужно на реакте написать sidebar. Кто может помочь, и что будет стоить?

Не работают события мыши в IE 11
Собственно весь вопрос уже в теме, нужно использовать событие мыши в IE 11, в частности onMouseEnter и onMouseLeave. Как это сделать, в chrome всё норма

Touch slider
Всем привет. Пытаюсь создать touch слайдер. Не понимаю почему слайды двигаются криво import React, {useState} from 'react'; import './slider.css' import SliderArray from "./slides/slides"; ...

Слишком много повторяющегося кода в Редаксе
Представим, что у нас приложение средней крупности, в котором из UI (Реакта) через Редакс делаем кучу асинхронных запросов на бэкэнд (изменяем данные в БД) На основе документации Редакса для каждого...

Хранение фрагментов кода в json
Планирую хранить на сервере информацию в json, но значением одного из полей должен быть фрагмент js кода, который потом буду выводить текстом на страницу. Нужно сохранить форматирование, как я...

Не рендерит React страницу из-за 404 ошибки
Доброго времени суток! Пытаюсь создать первое приложение на реакте Мой package.json { "name": "budget", "version": "1.0.0", "scripts": { "start": "lite-server"

Запись значения из select в input
Привет всем! Есть форма <form action="#"> <div class="submit-field-location"> <select class="chosen-select" name='options'> <option value='option-1'>Option 1</option> <option...

Добавление ReactJS в проект без запуска через npm
Всем привет! Имеется готовый проект. Бэк на Yii2, фронт написан в нём же. Подскажите, пожалуйста, как добавить кусочек фронта на ReactJS в готовую страницу, так, чтобы, например, в OpenServer'е при...

Не пойму, как отправить форму на ReactJS
Не могу никак отправить данные на почту. У меня довольно большое приложение с redux, а все туториалы на эту тему сделаны в условиях небольшого приложения с локальным state. Так вот я попытался...

SignalR + ReactJS потеря состояния компонента
Здравствуйте. Разбираясь с реактом, решил написать небольшой чат. Он состоит из двух компонентов: RoomChat и RoomChatControls. RoomChat содержит в себе textarea для вывода сообщений и, собственно,...

Получение данных из поля ввода
Как получить данные с поля ввода и вывести их например рядом с формой? Через onChange не получается, так как оно начинает сразу же печататься.

Событие плохо срабатывает
Есть компонент: import React from 'react'; import './todo-list-item.css'; export default class TodoListItem extends React.Component { state = { 'done': false,

TextField теряет фокус после первого введенного символа
Добрый вечер. Практически всегда при вводе текста в TextField теряется фокус на поле после первого введенного символа. Если нажать на поле второй раз и продолжить писать - все ок. Подскажите с чем...

Как правильно записать условие на react js?
<html> <head> <script src="https://npmcdn.com/react@15.3.0/dist/react.js"></script> <script src="https://npmcdn.com/react-dom@15.3.0/dist/react-dom.js"></script> <script...

Ошибки при запуске проекта
Скачал react-проект с github от блогера, который делал курсы криптовалют на стриме, у него ошибок небыло. Когда запустил я посыпались ошибки в консоле браузера. В терминале всё нормально было....

Есть список книг (массив), при нажатии на конкретное значение получаешь описание той книги, на которую нажал
import React, { Component } from "react"; import "./App.css"; import booksData from "./api/booksData.json"; class WeatherDisplay extends Component { constructor() { super(); ...

Использование constructor(props) super(props)
Компоненты в React, я знаю, можно задать двумя способами - как класс и как функцию(стрелочную или обычную). У меня компоненты заданы как стрелочные функции, т.е... const App = (props, state) => {...

Как сделать такое выпадающее меню на React?
Подскажите как сделать такое выпадающее меню, с вложенным уровнем на React. Что-то нечего не могу найти в интернете похожего...

i18next.t не видит ключ
Всем привет. Пытаюсь сделать локализованную строку с помощью i18-next. Вызовы вида: i18next.t("namspace.ключ"), i18next.t("namspace:ключ") и i18next.t("ключ", {ns: "namespace"}) выдают название...

Динамически менять псевдо элемент
Здравствуйте!!! Подскажите можно ли менять псевдо элемент например :before? Например у примера ниже у дива есть :before как можно менять именно псевдо элемент? <div style={ { width: props.width }...

React Native: переключение экранов
Всем привет! Нужен Ваш совет, как лучше и правильнее реализовать переключение с загрузочного экрана, на экран, допустим, регистрации. Т.е мне необходимо через некоторое время, допустим через 5...

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

How set file name from a pdf base 64 into iframe
Когда я нажимаю на иконку Download from iframe (html), мне нужно добавить собственное имя в pdf base 64, которое я получаю из back-end (я попытался отправить заголовок с именем файла с net. Core без...

Как правильно обновлять state на основе предыдущего значения state? Какие могут при этом возникнуть проблемы?
Как правильно обновлять state на основе предыдущего значения state? Какие могут при этом возникнуть проблемы? Обновить state на основе предыдущего значения - я разобрался. Не пойму какие могут...

Не удаётся импортировать модули React.Js ES6
Есть такой вот файл конфига { "name": "my-app", "version": "0.0.1", "scripts": { "start": "lite-server" }, "dependencies": { "eslint": "^4.4.1", ...

React Native. Клик по кнопке при открытой клавиатуре
Всем привет! Проблема такая: При открытой клавиатуре, если нажать на кнопку Continue, то кнопка не срабатывает. Вместо этого срабатывает закрытие клавиатуры. И только потом можно уже нажимать...

Подскажите что и как? ReactJS
var jsontext=''; var comments = JSON.parse(jsontext); var sost=true; const Comment = (props) => { let { general, job, address, contact } = props if(sost){ ...

Несколько state в редьюсере перед конструкцией switch case
Творится что-то паранормальное! У меня в редьюсере несколько state, когда я вывожу в консоль, вот: export const costsReducer = (state = initialCostsState, action) => {...

react-joyride + modal
Доброго времени суток. Пытаюсь настроить подсказки для пользователей, суть в следующем - по кнопке в хедере считывается текущий url, в зависимости от страницы вылезают подсказки по текущему...

UseEffect. Не сразу обновляются данные в таблице
Здравствуйте, у меня есть некоторый дроплист от значения которого должен выполнятся определенный GET-запрос к серверу. Проблема: Url меняется, но изначально данные таблицы пустые, вместе с полученным...

Как передать св-во дочернему элементу от родителя
eachTask(item, i) { return ( <Task key={i} index={i}> {item} </Task> ); ...

Скрытие лишних блоков компонента без опционального доступа
Всем привет:) Ситуация такая: есть готовый компонент SketchPicker из react-color. Этот компонент содержит лишние блоки, которые я бы не хотел показывать пользователю. Интерфейс компонента не...

Делаю сайт, по видео с ютуба, нужна помощь
Здравствуйте, делаю сайт по видео с ютуба, немного изменил его под себя, делаю в целях изучения технологий. Сделал какую-то клиентскую и серверную часть, дошло до объединения их в единое целое. Но...

Firebase
не работает авторизация через firebase,просто так перестало подключаться,кроме подключения из за того что все время пытается засетать юзера переполняется стек вызова. Получается все время приходит...

React Native. Сохранение внешнего файла json с проверкой на наличие обновлений в нём
Вечер добрый. Подскажите как сделать проверку на наличие изменения во внешнем файле? Предположим, я скачиваю файл json с сервера и сохраняю его через Async Storage. Но как сделать так, чтобы файл...

Реакт перестал импортировать файлы и компоненты
Я очень проблему в работе с React, она попадается мне очень часто. У меня не импортируются копмоненты и файлы в React. Конечно, чтобы импортировать файл я пишу: export let НазваниеФайла = Но...

Работа со свойствами в стейте
Есть два свойства в стейте, я хочу из одного свойства обратиться к другому внутри стейта. this.state = { dayDate: new Date().getDate(), dayOfWeek: this.state.dayDate } Бьет...

QR сканер для react на несколько камер
Здравствуйте. Нужно на react добавить возможность сканирования QR кода для входа в систему. Нашла компоненты типа react-qr-reader, react-qr-scaner. react-qr-reader тут возможность выбора камеры...

React JSX ошибка
Начал изучать React. C чистым React пока что всё понятно. Но как попытался запустить простейщий пример на JSX <!DOCTYPE html> <html> <head> <title>Hello React</title> <meta...

Сбрасывается состояние фильтров, сортировки и Pagination в Таблице при нажатии на чекбокс для выбора строки
Сбрасывается состояние фильтров, сортировки и Pagination в Таблице при нажатии на чекбокс для выбора строки. При нажатии на чек бокс таблица ререндериться в дефолтном виде. С очисткой фильтров и...

Группировка элементов диаграммы Ганта с одинаковым значением поля в одной строке
У меня кое-что не получается, уже давно ломаю голову.... Пожалуйста, взгляните на картинку, которую я прикрепил ниже: И у меня уже есть абсолютно все значения для отображения этой диаграммы,...

Ошибка при установке create-react-app
Привет! С чем может быть связана ошибка и как ее решить? npm ERR! code ERR_SOCKET_TIMEOUT npm ERR! network Socket timeout npm ERR! network This is a problem related to network connectivity....

React по два раза выполняет код
Здравствуйте. Создал новое react приложение, почистил и удалил ненужное и столкнулся с проблемкой, что код выполняеться 2 раза. Если посмотреть в консоли путь к источнику второго вызова, то там...

React и тернарный оператор
Я имею код который прячется при клику на кнопку Hide. Как сделать чтобы , когда header не видно, текст был "Show". Спасибо и добра вам) import './App.css'; import {useState} from "react"; ...

React router dom v6
root.render( <BrowserRouter> <div className="bg-gray-800 absolute h-full w-full"> <Routes> <Route path="/" element={<Home />} /> <Route path="room/:id" element={<Room...

Проблемы с состоянием аутентификации MobX
Доброго времени суток, создаю spa веб-приложение, для хранения всех состояний выбрал mobx, создал корневое хранилище (RootStore), создал хранилище с фичами для авторизации (AuthStore),подключил...

reselect (глубокое сравнение)
Как селектором добраться до списка фотографий в структуре, в которой несколько альбомов (они могут добавляться/удаляться) Я сделал динамический селектор, но он не отрисовывается при добавлении новой...

Проблема с react router: No routes matched location
При открытие собранного файла index.html выходит такая проблема. router.js:809 No routes matched location "/C:/Users/%D0%94%D0%B0%D0%BD%D0%B8%D0%B8%D0%BB/Desktop/dist/index.html" Вот как...

Парсинг данных
Здравствуйте! Мне необходимо сделать правильное чтение данных из txt-файла и по полученным данным построить один график для необходимого спектра(который выберет пользователь). В txt-файле несколько...

Ошибка теста с мок-компонентом Jest Enzyme
Для теста решила заменить дочерний компонент на обычную кнопку. При mount-е компонента в тесте, по идее, настоящий компонент должен заменяться на мок-компонент. Однако, мок-компонент просто...

Uncaught ReferenceError: exports is not defined в next.js 14!
react-refresh-runtime.development.js:530 Uncaught ReferenceError: exports is not defined at eval (react-refresh-runtime.development.js:530:9) at eval (react-refresh-runtime.development.js:542:7) ...

Проблема с функцией обработчиком onClick
Суть моего компонента: В input записывается значение в виде, далее нажимается кнопка посчитать и в результат записывается значение факториала (на данном этапе пока не выводит в результат), при...

ERROR in ./client/main.js
Всем добра. Не могу понять в чем ошибка((( ERROR in ./client/main.js Module not found: Error: Can't resolve 'react-hot' in '/home/mryudinit/Документы/testsBook' BREAKING CHANGE: It's no longer...

Как имитировать ошибку в "Fetch"?
Здравствуйте. Как имитировать ошибку в "Fetch", чтобы html элемент в ст 30 отображался на странице? import React, {useState} from "react" import "./asyncComp.css" import {fetchUsers} from...

Выдает ошибку, не могу понять в чем дело
import React, { useState } from 'react'; import { StyleSheet, Text, View, FlatList } from 'react-native'; import { NavBar } from './src/components/NavBar'; import { MainScreen } from...

Почему не передается props?
Здравствуйте. Создаю компонент сортировки товара в зависимости от цены. Компонент выглядит так: <code lang="javascript"> <Routes> <Route path="salad" element={<Salad selected={selected}...

Как сделать счетчик, с прокруткой цифр по разрядам reactjs?
Всем привет. Есть счётчик цифр с анимцией. Первая анимация начнется через 10 секунд Вот пример Нужно сделать так, чтобы числа прокручивались по разрядам (возможно это называется по другому). ...

Запрос Axios React js
Подскажите, как посылать данные на Axios React на кириллице? в кодировке UTF-8 и windows-1251 пробовал не работает

React Native Калькулятор
Здравствуйте! В Реакт Нативе я новичок от слова совсем и посему хоче кое-что спросить. Есть некоторый говнокод калькулятора del, писалось на коленке, но все же, хотелось бы перевести его в...

Итерация children
Здравствуйте! Почему не выводится children из app.js (<Record>)? Пытаюсь вывести чайлды из app.js в person-details.js, но почему-то коллекция пуста... Вывожу так: ...

Перевод из градусов Цельсия в кельвины
Здравствуйте, возникает ошибка в подсчёте именно в {temp+273.15}. Прибавляет не к числу, а ставит перед числом цифру. С Фаренгейтом все работает.(В React). import React, {useState} from 'react';...

Повесить событие на кнопку при динамическом создании кнопки в React
При выполнении события у меня вызывается функция, в которой рисуется кнопка; let html = '<button class="take" onClick={this.getActors}/>'; document.getElementById('log').innerHTML += html; ...

Не срабатывают Routes, Route, Navigate с пакета react-router-dom
Работаю с нодой не так давно и не знаю всех тонкостей. Методом пробы и вывода понял что не выводит данные написанные в тегах Routes, Route, Navigate которые импортирую с пакета react-router-dom....

Авторизация пользователя
Привет, есть сайт с nav панелью с тремя вкладками. мне нужно простую авторизацию чтоб для одного пользователя была видна ток 1 вкладка а, для второго пользователя все вкладки. Подскажите как можно...

Ошибка 404 при запуске проекта на сервере
С проектом вроде все норм, в dev mods все нормально, даже на хостинге все норм, но есть необходимость запускать проект на эмуляторе webos и там уже выдает ошибку 404. Еще такая странность может так и...

Вывод компонент в зависимости от props
Доброго времени суток. задумка такова - есть компонент, содержащий в себе другие, скажем такого плана: <Period /> <Group /> ... в родительский передается прос components={} в зависимости от...

Работа с API ?
Всем привет. Дали тестовое задание. Пытаюсь с api разобраться, но не могу понять как отправлять post запросы серверу и можно ли вообще это сделать? Хотя бы направьте на нужную мысль. Я обратился по...

Вывод компонента
Только приступил к изучению REact, поэтому возможно глупая проблема. Хочу по нажатию кнопки выводить компонент. Делаю так Кнопка import React from 'react'; import '../App.css'; export default...

Динамическая подгрузка скриптов
Коллеги, добрый день! Я новичок в JS\React, и мой больше относится к разработке на Java. У меня есть задача в готовом решении, которую я не могу пока решить, но может быть она и не имеет решения....

Отображение видео через react-video-js-player: The media could not be loaded
Всем привет! В плеере как правильно в коде указать путь к видео, расположенному на сервере http : / / w w w . ****** . online по адресу: /root/media/video.mp4 ? class WinMain extends...

Microsoft Edge в асинхронных функциях переходит сразу к .catch
Есть пара методов с await axios, которые некорректно работают в Microsoft Edge. На localhost не работает авторизация. При авторизации появляется ошибка: "Unhandled promise rejection Error" По...

Как избавиться от ненужного rerender компоненты
Здравствуйте, уважаемые форумчане! Сделал панель, которая сворачивается и разворачивается слева от экрана. Но когда обновляю какое-либо состояние (например, меняю язык страницы), происходит rerender...

Спрятать пагинацию
У меня есть код, который берет данные из API вместе с пагинацией. Как сделать так чтобы всех ссылок пагинациы не было, а были видны первые 10 с кнопкой следующий? import React, {useEffect,...

Как предоставить любому тексту возможность быть отредактированным?
Здравствуйте, как предоставить любому тексту возможность быть отредактированным? Это нужно как-то сделать без атрибута contentEditable. При обычном клике на текст, он не должен выделяться и быть...

Некорректно работают условные классы
С помощью условий задается класс для отображения лоадера: render () { return ( <> <div className="d-block"> <div> ...

Как воспользоваться тегом <picture> в react
Всем привет, хочу в компоненте что бы была картинка, которая при изменении браузера (если браузер не поддерживает webp ) показывала картинку jpeg. Соответственно все оборачиваю в тег picture, но...

next.js 14 - кеш fetch - запроса обновляется, даже если не выставлять опцию revalidate
почему? каждый раз при обновлении страницы время обновляется type Time = { datetime: string } async function getTime(): Promise<Time> { const res = await...

Ошибка Objects are not valid as a React child
import React, { useState } from 'react'; function CitySearch(props) { const = useState(''); const = useState(); const handleChange = (event) => { ...

Как получить массив из БД средствами Promise?
Сначала я получаю userId и тут все хорошо: firebaseApp.auth() .signInAndRetrieveDataWithEmailAndPassword(email, password) .then(response => { ...

добавление пользователя в базу данных
пытаюсь добавить пользователя в бд код формы: import * as React from 'react'; import { RouteComponentProps } from 'react-router'; import { Link, NavLink } from 'react-router-dom'; import {...

Ошибка при запуске проекта на react native. Меняла версию gradle
error Failed to install the app. Command failed with exit code 1: ./gradlew app:installDebug -PreactNativeDevServerPort=8081 FAILURE: Build failed with an exception. * What went wrong: A problem...

App.js Не срабатывает на index.js
Вот код app.js import logo from './logo.svg'; import './App.css'; const Header = () => { return <h2>Hello world</h2> } function App() {

Redux-saga вызов при срабатывании экшена
У меня есть такая сага import API from "./../Api/Api"; export function* outPutDataSaga() { yield put(outputFromLocalStorage(yield call(API.getAllTasks))); } export function* watchSaga() {...

Отправить на сервер html из render
Как отправить на сервер(через jquery ajax) хтмл из render компонента? class Clock extends React.Component { constructor(props) { super(props); this.state = {date: new Date()}; }...

Запустить проект react готовый шаблон
Всем привет. Помогите новичку. Осваиваю React, скачал шаблон админки основанной на react с библиотеками, закинул в папку на локальном сервере и через команду в консоли пытаюсь запустить проект, но...

Синхронный скролл
Доброго времени суток! Подскажите как решить задачу. На странице через map формируются к примеру 4 блок, у каждого из них есть свой горизонтальный скролл. Как сделать так что бы когда скролишь один...

ReactJS: Првоерка кук
Здравствуйте форумчане. Делаю приложения используя сервер написанный на NodeJS&ExpressJS и веб клиент на ReactJS. Имеется авторизация пользователя с куками, куки формируются на сервере с помощью...

React + websocket как поднять данные из метода сокета
Здравствуйте. Есть код на Js React. Так же используются вебсокеты. У сокетов есть метод onmessage. И нужно, что бы в это методе данные поднимались наверх в компоненте (для обновления стейта), но в...

Как убрать из этого кода отображение секундных стрелок?
Всем привет, Хочу добавить на сайт флип часы найденные в сети, но нужно убрать отображение секундных стрелок. Я пробовал вырезать блоки create seconds, но в результате у меня то полностью не...

Пишу первый раз на реакте, в чем проблема?
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width,...

React как переписать классы на хуки?
Может кто-то сможет объяснить, как переписать классы через хуки? В любом случае спасибо за мнение) import React, { Component } from "react"; import ReactDOM from "react-dom"; import...

Ошибка деплоя реакт приложения gh-pages -b build
В json файле прописал домашнюю директорию, прописал predeploy, deploy. При деплое выкидает ошибку. Хотел загрузить сайт на GitHub pages Прошу помощи)https://ibb.co/d3CstA

Как включить ввод секунд у datepicker?
Можно ли как-то включить ввод секунд в форме датапикера? Я вижу ток часы и минуты. При попытке указать формат dateFormat="MMMM d, yyyy HH:mm:ss" в инпут появляются секунды, но они обнуляются, когда...

Код реализации компонента Money
код реализации компоента Money Пример использования: <Money value={5000.99} currency='USD' /> * Параметр: value - число, может быть дробным * Параметр: currency - тип валюты, "RUB", "EUR",...

Роутинг внутри таб элементов
Доброго времени суток! Пишу приложение на React и возникла необходимость настроить грамотный роутинг внутри табов. В чем суть. Входим в систему, слева боковая панель, переходим в кладку приложения...

В приложении React Native выдает ошибку "Cannot use 'in' operator to search for 'requestFullscreen' in null"
Добрый день! Я пишу андроид-приложение на React Native, и там у меня на одной из страниц есть видео. Идея такова, что я с главной страницы перехожу на следующую и включаю видео. Так переход на...

Как отключить запоминание браузером значений, введённых в InputMask?!
Уже всё перепробовала. Код всё равно запоминается.

Подскажите как добавлять атрибуты к html элементам в react
Прочесал интернет но не нашел нормального ответа на мой вопрос. В js был setAttribute а в React ?

Как перейти на более старую версию react js
Нужно перейти на старую версию реакта . Как это можно реализовать?

Компонент отрабатывает но не отображает изменения
Подскажите, это в reactе бага что компонент отрабатывает но не отображает изменения? т.е. в компонент - стрелочаня функция, получает обновленное состояние (useState) вижу что отрабатывает но никак...

Почему не работает путь к изображению в React приложении?
Как указать относительный путь к изоражению в react приложении? Архитектура такая Мне сказали что нужно указывать относительный путь import image from "./img/sweater-1.webp" import React...

Добавление React в локальный сайт
Добрый день. Хочу попробовать встроить React в существующий сайт - дабы изучить что-то новое, т.к. в офисе начинают разработку на React, но никого еще нет. Сайт в локальной сети на PHP, Javascript и...

Не работает клонированный репозиторий
Клонирую раннее созданный React проект из github. Прописываю npm install, устанавливается папка node modules, запускаю проект локально npm start проект запускается появляется верстка. При изменении...

Не видит файл с кодом
Хочу сослаться на файл с кодом, смотрел в уроках оно уже при вводе должно отображаться для выбора на какой файл сослаться, у меня почему-то такого нет, хотя файлы в одной папке и всё сохранено. Хочу...

React Native - рендеринг элементов массива
Здравствуйте. Совсем недавно начал изучать React Native, да и React в целом. Как можно помимо FloatList срендерить элементы из массива? Суть в том, что у меня есть файл с данными и мне нужно взять...

Как подключить localStorage к todo list (react)
Здравствуйте. Делал простой todo list на реакте с использованием хуков и хотел подключить к нему localStorage, что б todo айтемы хранились в нем, и при первом рендеринге брались из него (если они...

Проблема с React Hook useEffect has missing dependencies: 'id' and 'showDetail'
Вот мой код const Detail = () => { let { id } = useParams(); const { showDetail, selectedMovie } = useContext(MovieContext); useEffect(() => { showDetail(id); // useParams ile alınan...

Завершается процесс после закрытия консоли
Коллеги, приветствую! Ситуация: есть сайт и админка к нему. Живут на виртуалке в трех контейнерах. Сайт в одном, БД во втором и админка в третьем. После перезапуска виртуалки БД и сайт подняли,...

Отобразить компонент
Вкатываюсь в react. Пытаюсь сделать элементарное - отобразить компонент, внутри которого будет вызываться и отображаться другой компонент, но у меня не получается. var TestHeader =...

Дочерний компонент не обновляется при изменении его свойства
Родитель .Строка 121 и 245 import * as React from "react"; import User from "./User"; import Outgoing from "./Outgoing"; import Incoming from "./Incoming"; import UserModalMessage from...

Валидация форм, Formik, как сообщение с ошибкой отобразить в инпуте? как подсветить рамку инпута REACT
<p className={s.sizeBig}> <label htmlFor={`street`}>Улица *</label><br /> <input className={cn(s.input)} type={`text`} ...

Как иницилизировать метки?
Здравствуйте, подскажите, как иницилизировать все метки, которые получаю с api? Http.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { var bikePoints =...

Почему не работает Портал?
Здравствуйте, подскажите пожалуйста что не так делаю. Error: Target container is not a DOM element. GitHub:...

Как отправить переменную из компонента App.js в компонент index.js где хранится стейт?
у меня создан useState переменная, которая хранит водимое значение из инпута, можно отправить эту переменную number из компонента App.js в компонент index.js где хранится Стейт чтоб можно было к нему...

Приложение на React не работает в Internet Explorer 11
Как обеспечить работу приложения в данном браузере?

Почему не прокидываются пропсы в компоненту?
При рендере компоненты должны приходить пропсы, но компонента рендерится без них, а в стейте они в итоге есть. import React from "react"; import Machine from './machine' import {compose} from...

Какой Datagrid в React лучше использовать
Добрый день, использую datagrid из material-ui, но его сейчас не используют и он не совместим с react. Каким компонентом его можно заменить и чтоб он нормально работал с react?

Изменение числа в калькуляторе после нажатия на кнопку "="
import React from "react" import buttonBox from "./buttons" import "./App.css" class App extends React.Component { constructor() { super() this.state = { //это реакт out:...

Как загрузить на сервер js файл в нём используется react чтобы он работал?
есть готовая папка и я её загрузил на хостинг но код не работает он не понимает import что делать? Мне в итоге нужно перенести с локального сервера на хостинг

Не знаю как применить componentDidMount
Пытаюсь применить componentDidMount() в классовой компоненте, но не могу понять в каком месте. У меня есть страница со списком сотрудников, при клике на сотрудника появляется справа подробный...

Добавить строку в таблицу по клавише tab
Всем привет не соображу как добавить в таблицу новую строку по клавише "tab" Таблица сделана на reactjs, я просто создал массив в котором прописал нужные строки. имеет вид: 1. строка 1 2....

React-router-dom
Доброго времени суток, у меня есть <Route /> который отрабатывает по пути "path="/product"". Мне надо что бы Route отрабатывал по части пути, тоесть <Route path="/{любое выражение}-product" /> и...

Отображение номера текущей страницы pdf документа
Листается pdf-документ. У каждой страницы есть индекс. Как сделать, чтобы под pdf-ом всегда отображался номер текущей страницы?? Спасибо!

Подсоединить проект React к Visual NET
Всем привет https://www.c-sharpcorner.com/article/crud-operations-in-reactjs-with-axios-using-web-api-and-sql-server/ Вопрос в том, КАК соединить папку с проектом React к NET проекту. В...

Как итеративно рендерить дерево компонентов? как я понял рекурсия более затратна по производительности?
Как итеративно рендерить вложенные компоненты? как я понял рекурсия более затратна по производительности? Уровней вложенности может быть неограниченное количество. Проблема в том, что при...

Не выводятся данные из store
http://************/r5cs8cЗдравствуйте! Может кто сталкивался, подскажите плз. В общем в приложении использую redux. В store хранится два массива - filters и coktails. const initialState = {...

Переход по страницам
Здравствуйте! Впервые пишу проект на реакте. Помогите, пожалуйста, сделать переходы между страницами в хедере. Вот сам хедер: Хочу сделать переход на страницу контакты и на главную. Вот...

Форма реакт, вывод цены от и до
Изучаю реакт, возникла проблема с формой поиска, в полях "Price" дублируются значения. Что в этом случае лучше сделать? Присвоить key элементам (чтобы от и до в цене показывалось) или лучше как-то...

Не получается передать пропсы между компонентами
в AllProduct компоненте есть компоненты Header и CartOverlay.Функции передаю непосредственно к этим компонентам с помощью пропсов.Вопрос в том что есть еще один компонент Technology в котором...

Ищу хорошую практику по работе с формами для сайта с большим количеством форм
Есть задача написать сайт с большим количеством форм ввода данных. Около 30 интерфейсов будет (по 10-30 элементов в каждой форме). Сайт внутренний для корпорации. И эти формы постоянно обновляются и...

Не получается изменить размер миниатюр в пакете react-grid-gallery
Не получается изменить размер миниатюр в пакете react-grid-gallery https://github.com/benhowell/react-grid-gallery#programmers-notes Всё равно размер получается больше указанных размеров(сама...

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

Получение данных из API
Не получается получить данные с API. Для аутентификации на сервере необходимо добавить к запросу заголовок «TMG-Api-Key» со значением API_KEY, скорее всего я что-то не так добавляю. Функция с...

Динамическое содержание в компоненте
Здравтсвуйте! Стоит следующая задача: На сервере: В определенный момент запускается сборщик некоторой части сайта - на выходе 3 файла: module.html, module.css, module.js Эти три файла...

Надо установить react-konva, но выдает ошибку: 96 vulnerabilities (85 moderate, 11 high).
Сап! Тут такая проблема мне надо установить react-konva, но выдает ошибку. Как я понял связано это с конфликтом между библиотеками, хотя хз. Я создал React через npx create-react-app my-app 1) На 1...

Проблема с асинхронностью useState React
Всем привет. Пишу программу погодную на реакте и столкнулся бедой с хуком useState. а именно то что он асинхронен и дату которую я должен получить в state получается на первый клик сабмита null а на...

Последовательные (и зависимые) API вызовы - Реакт Редакс
Всем привет. Мое приложение делает 2 запроса к разным API. Представим, что: 1) первый запрос получает данные о юзере через экшен креатор callFirstAPI() 2) второй запрос получает посты этого...

ERROR: JAVA_HOME is set to an invalid directory: /usr/lib/jvm/java-1.17.0-openjdk-amd64
какую директорию не сую в JAVA_HOME, всё неправильно для проекта на react native. подскажите что сделать чтоб данная ошибка пропала?

Изменение цвета звёздочки required по нажатию InputLabel в material-UI React
const useStyles: StylesHook<any> = makeStyles({ paper: { height: '280px', width: '600px', }, closeButton: { position: 'absolute', top: '8px', ...

fetch возвращает разметку текущей HTML страницы вместо ошибки что файл не найден
Всем огромный привет! Вопрос: Почему fetch возвращает HTML разметку страницы вместо того, чтобы отловить ошибку, запрашиваемый файл не найден? Контекст: Создаю запрос на загрузку данных...

Как организовать mobx store?
Есть код, где в store в state хранится folder_id, employeesList и currentEmploySelect. То есть текущая папка, список сотрудников и текущий выбранный сотрудник. Store 1 на всё приложение. Сейчас...

Next-connect в Next.js. Проблема 500 Internal Server Error
Делаю приложение на Реакт и товары, которые я добавил в корзину после их добавления в карту не сохраняются в базе данных. Получаю такую ошибку - POST http://localhost:3000/api/user/saveCart файл...

Импорт нескольких файлов, содержащих состояние
Здравствуйте, уважаемые форумчане! Столкнулся со следующим вопросом. Допустим, у меня есть компонента и объекты, содержащие ее свойства вместе с состояниями в виде: const left_right_shift = { ...

Не могу загрузить фото
Хз, че за тема, но я не могу загрузить фото. Делаю я это таким образом: import Lingua_desktop_1 from './src/images/Lingua_desktop_1.png' <img src={Lingua_desktop_1} width="300" ...

Не удаляются инвойсы из DOM и db.json
Есть прога которая рендерит инвойсы с json файла , их можно удалять при помощи кнопки Remove напротив каждого инвойса в разметке. Проблема в том что при нажатии на кнопку Remove компонента...

Как сделать такой же запрос на другой странице через input?
const FirstPage = (props) => { let newText = React.createRef(); const getHotels = () => { ...

Кастомизация react-bootstrap
Начал использовать react-bootstrap и хочу узнать могу ли я как-то изменить стили у стрелок навигации карусели, хочется их вынести за за карусель и изменить цвета , то есть левую стрелочку хочу...

React как правильно вывести массив в refs.value?
Есть следующая функция, которая работает при нажатии кнопки. Должна сравнивать index приходящего массива и находить его в массиве works, не могу понять как записать works или list в value. Сейчас код...

Проблема с выводом массива через карточку
Здравствуйте, у меня возникла проблема с выводом массива через индексацию. Суть проблемы в том, что при использовании mavies.map карточки выводятся в виде одной колонки, а в этом методе страница...

Как сгенерировать файл .d.ts из файла .scss?
Пробовала yarn tsc src. Выдаёт ошибку: Could not resolve the path 'src' with the extensions: '.ts', '.tsx', '.d.ts', '.cts', '.d.cts', '.mts', '.d.mts'.

React JS фото из папки
Как в react js вывести все фото из папки?

Проблема с подключением Chakra UI в Next.js (Pages)
хочу установить Chakra UI но сыпятся куча ошибок, после написания в файле _app.jsx ChakraProvider. Опишу просто каждое свое действие: 1. Устанавливаю next npm install next@latest react@latest...

Каким образом можно обойти первый рендер от хука useEffect?
Доброго времени суток. Часа 3 пытаюсь решить одну проблему, на самом деле максимально примитивная. В общем, не вдаваясь в подробности. К примеру есть состояние и функция, которая меняет это...

Как сделать поворот страниц pdf документа в React?
поступило такое задание

Не могу выложить проект на github pages
Добрый день. Выкладываю проект на gh-pages, но при попытки посещения этой страницы показывается только сообщение Unexpected Application Error! 404 Not Found { "name": "typing-training-app", ...

Автоскролл до конца при загрузке динамических картинок
Добрый день. Реализовал алгоритм автоматического скролла вниз до высоты окна. Но когда загружается динамическое изображение первый раз - окно не хочет скролить его до конца. При повторной загрузке -...

Render()
Собственно, вопрос. Почему рендер у классовой компоненты срабатывает 1 раз class MyPosts extends React.Component { constructor(props) { super(props); this.postElements =...

Добавление компоненты в StoryBook
Доброго времени суток, есть такой вопрос, есть управляемая компонента, пропсами передаётся size с union типом 'small' | 'medium' | 'large', в StoryBook он подсказывает что это InputType, но при...

Проблема с импортом кастомной библиотеки CKEditor
Здравствуйте. У меня есть проблема с импортом кастомной библиотеки для редактирования и создания статей, новостей CKEditor. По их инструкции я выбрал нужные мне плагины, скачал и залил папку...

Добавить ссылку в текст слайдера
Доброе времени суток. Помогите советом пожалуйста. Имеется слайдер....

React middleware error
тут проект с ошибкой - https://github.com/SashaMaksyutenko/payShopReact Подскажите пожалуйста как исправить ошибку в файле, код которого ниже import { configureStore } from "@reduxjs/toolkit";...

Как промотать вниз react-scrollbar
https://www.npmjs.com/package/react-scrollbar Это код из родительского компонента let chatMessages = ''; if (this.props.messages.length > 0) { let messsages =...

select изменить стрелку когда меню открыто
Добрый день. Чего-то совсем не могу нагулить. У select есть стрелка по умолчанию (с права) 1. её надо изменить на любую svg 2. когда меню открывается её нужно изменить на другой svg ...

Разработать просто приложение, которое произведёт расчёт площади окружности
Здравствуйте. Мне дали задание "Разработать просто приложение, которое произведёт расчёт площади окружности". На основе React.js. Никак не могу сделать, помогите, пожалуйста <3

Проблема со спиннером и onLoad
Всем привет, Не могу разобраться с onLoad. Дано - галерея изображений, urls хранятся в S3 и DataStore (aws amplify). На странице делается запрос в датастор, фото грузятся, каждая фото имеет onLoad...

React.lazy и имена файлов
Добавил в проект React.lazy. Бандл теперь дробиться все ок. Но есть вопросы: 1. Имена файлов генерируются примерно так 876.script.js - эта цифровая приставка - она надежно закреплятся за скриптом...

Индикатор при загрузке
Здравствуйте! На многих сайтах при загрузке контента в самом веху фиксированная полоска загрузки. Подскажите, если разные модули будут влиять на эту полоску, то как это все дело организовать в...

Во всех строчках где есть styles выдает ошибку, почему?
import React from "react"; import {StyleSheet, View, Text, Button} from "react-native"; import {AppCard} from "../components/ui/AppCard"; export const TodoScreen = ({goBack, todo, onRemove}) =>...

Автоматическое перенаправление после запуска npm start с http на https
Здравствуйте, уважаемые форумчане! Столкнулся с проблемой перенаправления с http на https после запуска проекта на настоящем (не локальном) сервере. Хостинг, к сожалению, не может помочь. Настройки...

Добавления состояний в Redux
const defaultState = { isBasketShow: false } const reduser = (state = defaultState, action) =>{ switch (action.type) { case "OC": return {...state, isBasketShow:...

Обновляется ли весь компонент, если изменения произошли в дочернем компоненте?
Обновляется ли весь компонент если изменения произошли в дочернем компоненте?

Хуки в нерендерных компонентах
Здравствуйте. Подскажите, пожалуйста, вот есть функциональный компонент сокет. Т.е. рендериться он не будет. 1. useState при изменении триггерит рендеринг- а здесь не будет ничего лишнего, что...

Согласование в React
Есть много вопросов. Начну по порядку. По определению. Есть DOM-дерево, при срабатывании setState, у нас создаётся virtualDom предыдущего состояния дерева и VD нового дерева, затем ищутся изменения...

Как исправить 401 (Unauthorized)?
Здравствуйте, сделал jwt авторизацию и регистрацию. Но при проверки авторизированный ли пользователь выдаёт 401 Unauthorized отправлял через axios запрос на получение refresh токена(react/redux) Вот...

Ошбика или нет ? React Native
кто нибудь объясните почему эта ошибка выскакивает ? что с ней не так ? и как ее исправить ?

Как удалить товар?
https://codesandbox.io/s/loving-http-ir83z9?file=/src/ProductList.js не работает удаление товара(попробуйте создать товар и потом удалить)

dispatch из useReducer() не вызывает ре-рендеринг
Почему dispatch из useReducer() не вызывает ре-рендеринг компонента? export const WeatherForecast = (props) => { const = useReducer(reducer, s) useLayoutEffect(() => { ...

План обучения ReactJS для новичка
Приветствую. Сейчас активно изучаю js и в дальнейшем планирую изучение реакта. Хотел задать опытным несколько вопросов, чтобы правильно организовать учебный процесс. 1) Какие разделы ванильного js...

Webpack + React + использование различных версий одного компонента
Добрый вечер. Подскажите по следующему вопросу: Есть backend написанный на python/django. Есть frontend написанный на java script/react. Webpack собирает один bandle. Backend и frontend написаны...

React + Electron, content security policy блокирует fetch запросы к сторонним api
Добрый день! Помогите пожалуйста исправить проблему с Content security policy. Проблема заключается в следующем: При помощи Electron Forge внедрил свое ReactJS приложение в ElectronJS, но...

Передача данных в компонент через Link
Всем привет! Написал такой код, но не получается извлечь переданные данные Смотрите строку с Link, там отправка данных компоненту реализована import React from 'react'; import { Link } from...

Изменить значение объекта в массиве
Добрый вечер. Есть массив со значениями. Вопрос в том как поменять значение по индексу. Условно нужно изменить title: "new task" для элемента с id = 2. const = useState(); Пробовал как-то так,...

Swiper React: Почему не работают стили для элементов?
Почему не работают стили для навигационных кнопок? import { Swiper, SwiperSlide } from "swiper/react"; import { Navigation } from "swiper"; import "swiper/scss"; import...

Неожиданное поведение редьюсера redux
Всем доброго времени суток! Столкнулся с такой проблемой при использовании Redux: при выводе в logger middleware состояние компонентов item ведет себя некорректно: action INCREMENT prev state ...

ReactJS для начинающих
Ребятушки, если хотите создать свое приложение на ReactJS - добро пожаловать https://www.youtube.com/watch?v=BphfiFL6fzo

React Server-side рэндеринг
Хочусделать приложение с рэндерингом на сервере. Пытаюсь сбилдить: const path = require("path"); const express = require("express"); const app = express(); const port = 3000; const...

Ничего не понимаю, установка React и node js
Установил React с последней версией node js Создалась папка /root/react-intro Как я понимаю это веб приложение, какие необходимо произвести манипуляции для того, чтобы ее переместить где...

Не сохраняются данные в массив
import { StatusBar } from "expo-status-bar"; import { useEffect, useRef, useState } from "react"; import { StyleSheet, Text, SafeAreaView, Image, Button, TextInput, } from...

Как правильно использовать иконки в React через иконочный шрифт, или просто как svg картинки?
У меня есть на проекте 20+ иконок, как лучше добавлять их, через иконочный шрифт icomoon или через svg? И если через иконочный шрифт, нормально ли использовать это...

Как сделать правильную постраничную пагинацию?
Всем доброго времени суток. Есть сайт, на нём много страниц с карточками На каждой странице есть вот такая пагинация (см скрин 1) Есть вот такие входные данные: const countPage = 17 // общее...

useContext и значение в функции
Выдумал сам себе задачу. Запускается приложение и в стейт добавляются с некоторым интерваломю Сделал примерно такой код function App() { const app = useContext(AppContext) let index = 0;...

Double API call
Здравствуйте! Кто объяснит почему у меня дважды аплоудится картинка на сервер? Использую antd библиотеку. Вот код компонента: <Dragger accept='image/png, image/jpeg,...

React router - как загрузить на клиенте
Изучаю реакт. Если бы сервер был на node.js с этим не было бы проблем: npm и так далее. А сервер на php и react подключается посредством тега script. Нужен роутер. Возможно ли как-то подключить,...

Как получить и воспроизвести следующий трек?
Это код аудиоплеера на реакте, пытаюсь сделать переход на следующий трек по нажатию на соответствующую кнопку, но выдаёт различные ошибки, как правильно в данном коде воспроизвести следующий трек по...

Нужно ли удалять eventlistener?
import React, { useEffect, useRef } from 'react' const Component = () => { const rootRef = useRef(null) useEffect(() => { const el = rootRef.current ...

Написать простое мобильное приложение позволяющего найти корни квадратного уравнения.
Написать простое мобильное приложение позволяющего найти корни квадратного уравнения.

Слайдер который работает при прокрутке и когда крутиться слайдер то и страница тоже должны крутиться
пример как должен работать: https://chulakov.ru/company мой код: constructor(props) { super(props); this.state = { reviews:

Не могу понять в чем проблема, последняя строчка container выдает ошибкой
import React from 'react'; import {StyleSheet,Text, View } from 'react-native'; import Constants from './src/NavBar'; export default function App() { return ( <View...

Ошибка Illegal characters in path при выполнении команды build
Здравствуйте друзья. Помогите пожалуйста с проблемой. Не можем решить. При попутке создать заливочный файл выдаёт такую ошибку, хотя через макбук всё нормально заливается. Но через винду не...

Route и UseEffect
Всем привет ! Вот код. //----TASKS------------------------- export const Tasks =() => {return (<div><h1>Tasks</h1></div>);} //----PROFILE----------------------- export const ...

Ошибка при использовании useEffect
Добрый день Возникла проблема, которую удалось отследить только до данного хука. У меня есть 2 компонента: 1. Accordion const Accordion = ({ /* ... */

revalidate option in fetch doesn't work. the information on the webpage doesn't update
type Time = { datetime: string } async function getTime(): Promise<Time> { const res = await fetch('https://worldtimeapi.org/api/timezone/America/Chicago', { next: {revalidate: 3}}) ...

Как сделать реагирующие точки на рисунке?
Всем привет! Есть задача и я не знаю как к ней подступиться и с чего начать. Обычную реализацию я сделал. Суть в чем: у нас есть таблица, и по нажатию на ячейку в стейт записывается данные в этой...

Как обновить компонент из другого компонента?
На странице есть хедер, контентная часть и футер - это всё компоненты. В хедере находится input type="text" и кнопка. Контентная часть выводит данные с сервера, используя axios. Сам скрипт запроса...

socket.io Дублирование сообщений в чате ReactJS App
Когда я отправляю сообщение, на первом клиенте(отправителе) все в порядке, сообщение не дублируется. Но у остальных пользователей комнаты (получателей) сообщение дублируется. В то же время, если...

Что не так в get запросе (axios)
Пол дня пытаюсь отправить запрос но почему-то отказывается работать. В постмене данные приходят отлично. Что не так? Просмотрел тонну вариантов решения этой проблемы, переписывал код по разному, но...

Обмен данными между компонентами, используя Redux
Добрый день. Мне нужно с помощью Redux объяснить одному компоненту, что произошёл клик мышкой в другом. В глобальном компоненте App я создал store: const store = createStore(reducer); ...

Кастомный хук
Добрый день, в чем разница этих хуков? не могу понять. Мне нужен хук, который будет тригерить в компоненту, когда флаг будет изменён, все. Эти хуки оба выполняют свою работу Какой эффективнее и в...

ReactJS для новичков
Здравствуйте! Начал изучать React. Встал вопрос - почему не работает нижеприведенный код App.js? Учусь в VSCode, ошибок кода нет. Буду признателен, если поможете. var News = React.createClass({ ...

Как исправить ошибку в своей реализации redux?
Всем привет. У меня не есть самостоятельная реализация redux (разбираюсь с чужим кодом). И у меня возникла следующая проблема. import React from 'react'; import ReactDOM from 'react-dom'; import...

Переписать кусок кода
Всем привет Можно ли переписать этот код более оптимально? componentDidMount() { const url = "https://api.myjson.com/bla"; fetch(url, { method: "GET" })

styled components + material ui
Добрый день. Вычитал такую штуку https://stackoverflow.com/questions/48612041/apply-same-styling-on-multiple-elements-in-component И вот мне надо её применить к тайпографи. Я хочу писать разметку...

Регулярные выражения
Добрый день! Возникла проблема с input number и регулярным выражением. У меня инпут числовой, но в него проходят символы плюс и минус. Как от этого добра избавиться? при выводе в консоли значения -...

Вложенный массив/объект
Здравствуйте. Я уже пару дней застрял, пока никак не могу понять следующее, пожалуйста, подскажите: Дан initialState в редукторе: const initialState = , }, { title:...

Выдает ошибку styles в строчке <View Style-{Styles.NavBar}>
import React from 'react' import {View, Text, StyleSheet} from 'react-native'; export const NavBar = ({Title}) => { return ( <View Style-{Styles.NavBar}> <Text...

React-native как облегчить сборку проекта
Всем привет! на react-native пишу не долго, поэтому буду рад, если укажите на ошибки. У меня в проекте есть такое место: Companenta.js import React, { PureComponent } from 'react'; import...

Получение большого количества данных и поиск
Разрабатываю API и SPA. Возникла проблема поиска данных на клиенте. При обычном подходе клиент получает сразу данные для вывода и поиска от API. Но так как в моем случае данных очень много (от...

Как подключить redux через хук
import T from '../helpers/functions'; import Page from "../components/Page"; import {connect, useSelector} from 'react-redux'; import * as React from "react"; function...

Почему не работает удаление из массива?
При удалении элемента из массива, почему-то всегда удаляется последний элемент. Пробовал разными способами: фильтром и через slice. Никак не могу понять почему так происходит. Parent component ...

Не видит установленный пакет
Сама ошибка: Failed to compile. ./src/App.js Attempted import error: 'Switch' is not exported from 'react-router-dom'. import './App.css'; import React from 'react' import Home from...

Как использовать React
Здравствуйте, пытаюсь изучить React, но не получается: я никак не пойму, как его использовать. Вот есть у меня страничка-профиль пользователя. И как его использовать? Каждый элемент рисовать через...

Не работает css при разбивки на компоненты
При разбивки кода на компоненты не работает нормально css,выводить он выводит ,но не работает как должен grid,не меняет цвет элемента. Как будто css не видит теги ,кроме header, с ним все нормально....

Как сделать счетчик лайков
Создайте компонент Like, который будет содержать кнопку (или ссылку) для нажатия и число лайков (то есть сколько раз нажато). При нажатии, число лайков должно увеличиваться. Например, <Like...

Localstorage как способ ускорения приложения
Всем привет. Скажем, у нас типичное приложение, которые получает некие данные от АПИ. Эти данные на серваке API обновляются раз в сутки. Скажем, в полночь. Что если мы будем их сохранять в...

Как создать проект на react native?
Вопрос покажется глупым, но я не понимаю, как создать проект react native cli, без expo, на JS, чтобы он сразу был работоспособным. Уже 6 часов пытаюсь настроить проект, чтобы он хотя бы запустился....

React, недопонимани­я
1. React основан на работе с рендерами? 2. Как проще всего настроить связь между компонентами React? 3. Все используют Store в качестве основы в React, или это специфика какая-то? 4. В чем...