Форум программистов и сисадминов КиберфорумКиберФорум - форум программистов и системных администраторов. Бесплатная помощь в решении задач по программированию, математике, физике и другим наукам, решение проблем с компьютером, операционными системами. |
|
Темы раздела React/ReactJS
Код после ИИ
Добрый день!
Может пишу и не туда, но в коде есть слово "react" потому решил начать отсюда!
Если не прав - поправьте меня пожалуйста.
И так, решил сгенерить код с помощью ИИ - многие так...
Отрисовка графа в динамическом canvas
Доброго времени суток :) Имеется вот такой компонент для отрисовки и работы с генерируемой анимацией(следующий шаг, заново и прочее). Канвас динамически изменяет размер в зависимости от устройства....
Библиотеки React
Коллеги. Просьба подсказать такие "рыбные" места как "Ресурсы React с UI-компонентами". Т.е. готовые решения и библиотеки. В идеале с примерами использования.
Вопрос о нежелании изобретать велосипед...
Задания на собеседование
Добрый день ребята. Меня попросили поучавствовать в собеседовании фронтенд-разработчика под react и подготовить несколько заданий. Я надеюсь вы не посчитаете не правильным, что я прибегла к форуру,...
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...
Передача переменных окружения в React на этапе npm build
Доброго времени, недавно столкнулся со следующей ситуацией. Паковал React в Docker по иснтрукции, в React есть несколько системных перменных которые планировалось туда брать с .env файла.
Однако,...
Переадресация в Routes
Доброе время суток!
Так всё работает,
export const privateRoutes = ;
export const publicRoutes = ;
return (
isAuth
Контроль доступа на основе ролей
Пет проект на локальном компе. На бэкенде dotnet Web API, на фронте ReactTS. Авторизация на основе JWT, данные хранятся в localStorage. Юзеры распределены по нескольким ролям.
Вопрос: Как...
Никак не могу перезагрузить страницу после удаления, добавления или вычитания количества
После нажатия на данные кнопки в сервере данные меняются а на странице нет,чтобы увидеть обновленную корзину надо нажать на обновить страницу
вот что пробовал
const = useState(0);
const...
Не читается значение свойства из стора 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 и андроид), что сайт открыт в браузере Телеграма, и в таком случае выполнить автоматическое открытие сайта...
Фильтрация дерева
Добрый день, форумчане!
При попытке фильтрации дерева данных, полученного с API, сталкиваюсь с проблемой.
searchTerm передаётся из другого компонента (страницы, где выводится этот компонент)....
Проблема со слайдером react slick
Добрый день.
Помогите, пожалуйста решить проблему.
Пытаюсь сделать слайдер с использованием react-slick.
На десктопной версии все работает норм, но как только перехожу на меньший размер...
Как сделать так чтобы при обновлении страницы через alt+ f5 или обновить данные сайта не сбрасывались
клиент src/http/index.js
import axios from 'axios';
export const API_URL = `http://localhost:5000/api`
const $api = axios.create({
withCredentials: true,
baseURL: API_URL
})
Как получить данные из парсера
Всем доброго времени суток!
Есть такая задача - сделать парсер сайта с вакансиями. Страница парсится нормально на php, но контакты как-то подгружаются без перезагрузки страницы ajax-ом....
Ошибка с ссылками на функции
Вот ошибка:
./src/components/modals/CreateBrand.js
Attempted import error: 'createBrand' is not exported from '../../services/DeviceService'.
вот CreateBrand.js он находится...
Ошибка при добавлении RTK
Ошибка:
chunk-CRPLlQ3x.js?v=bab8c8c6:25 Uncaught Error: Calling `require` for "react" in an environment that doesn't expose the `require` function. See...
Можно ли сделать 2D PvP файтинг на expecting node.js myself?
Позволяет ли скорость myself сделать 2д пвп файтинг наreact node jwt если нет то как насчёт mongodb(просто пока я им не владею)
Проблема с версткой при уменьшении/увеличении страницы
Добрый день.
Создала проект react+vite+ts: https://github.com/LiliiaGalkina/VR
При уменьшении или увеличении окна браузера, когда его тянешь мышью, сам сайт почему-то сжимается больше, чем окно,...
Как запустить проверку typescript типов без выделения дополнительной памяти?
Столкнулся с следующей проблемой, после обновления версии ant design c "antd": "5.15.0" на "antd": "6.2.2", возникает проблема с проверками типов, не хватает стандартного выделения памяти 4144 MB,...
Почему при обновлении страницы пропадает авторизация
http/index.js
import axios from 'axios';
export const API_URL = `http://localhost:5000/api`
const $api = axios.create({
withCredentials: true,
baseURL: API_URL
})
Stimulsoft - после активации лицензии из Viewer отчета не убирается водяной знак Trial
Всем привет. Подскажите плз, кто сталкивался.
Имеется лицензионный ключ StimulSoft
Устанавливаю в приложении React, согласно документации:
Stimulsoft.Base.StiLicense.Key = "ключ"
С...
Не пробрасываются слущатели событий
пытаюсь подучить реакт(я серверник по жизни)
вот по этому курсу: https://www.youtube.com/watch?v=SHDsVFMLtAQ&list=PL0MUAHwery4omH4GyVQ-lI2R326tOdN7A&index=6
Дошел до обраблтки событий. делаю...
Не меняется access token
server/controllers/userController.js
const userService = require('../service/user-service');
const {validationResult} = require('express-validator');
const ApiError =...
Вставить код из php в react
Мне нужно вставить код из php в react в цикле то есть несколько картинок. Как реализовать?? мне нужно из массива с картинками php сделать их вставку в jsx как в обычный div echo
function Rearchh()...
Как можно вместо массива использовать 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 =...
Не собирается приложение - ошибка в файле index.tsx
Всем привет.
Пытаюсь собрать приложение React webpack-ом, но выдает ошибку:
ERROR in ./src/index.tsx
Module build failed (from ./node_modules/ts-loader/index.js):
Error: TypeScript emitted no...
React (Balel) Какая разница в .js и .jsx
Вопрос в заголовке.
Я раньше почему-то думал что .jsx файлы это спецификация файлов для компилятора babel, но тут на меня нашло озарение - бабелю же всё равно какие файлы компилировать и то есть...
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>
...
Инструмент для парсинга сайта (nodejs + reactjs)
Нужен совет. Начал недавно изучать js + reactjs.
Делаю первый сайт в целях обучения.
Использую: nodejs, react(material ui, DevExtreme grid), npm.
Идея следующая:
1. Парсить данные с...
React js - рендеринг тормозит
У меня есть 2 компонента
Первый это таблица на основе fixed-data-table-2,(около 100 строк, будет больше) при клике на ячейку таблицы хочу показать модальное окно. В браузере вижу предупреждение **...
После установки ReactJS появляется белый экран, вместо заставки
Здравствуйте, уважаемые форумчане! Пытаемся переносить проект на ReactJS, но пока, к сожалению, ничего не получается. Вместо заставки в <div id="root"></div> ничего не загружается. Да еще, ошибки...
Почему не работают ссылки React на хостинге?
Написал заметочник на React. Заметочник состоит из нескольких страниц. Для навигации использовал react-router.
Локально работает все замечательно. Но после того как сделал react build и выложил на...
Uncaught SyntaxError: Unexpected token '<'. Что делать ?
Была проблема с импортом, решил обойти через константы ибо даже с "type:module" не видел модуля. Тут появилась другая проблема, начал ругаться в сторону рендера, а конкретно в строке: contents=...
Недостатки React
Здравствуйте. Расскажите пожалуйста о недостатках, архитектурный просчетах, неудобствах и т.д. с которыми вы сталкивались при написании приложений с использованием React.
В рунете (да и не только)...
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?
Пропадают элементы после перезагрузки страницы
У меня есть код, который создает мне список моих задач. Код является работающий. После того, как я создаю задачи, выполняю перезагрузку страницы то все мои созданные задачи пропадают.У меня есть 2...
Почему не удаётся запустить проект?
Помогите мне пожалуйста. Пытаюсь запустить проект, разобраться с реактом. Читаю в файле package.json
"build": "webpack -p --config webpack.production.config.js --progress --profile --colors",...
React форма авторизации
Предпринемаю очередную попытку глубже войти в фонтент
задача такая сделать форму авторизации(логин).
Создал проект create-react-app создал компонентю нарисовать формачку не сложно(можно любой...
При хранении объекта в Redux, как хранить состояние полей редактирования (input)?
Есть некоторый список, который хранится в redux, например такой:
{
1: {
name: 'Саша',
},
2: {
name: 'Маша',
},
3: {
name: 'Наташа',
Как задать плавный toggle в ReactJS?
Здраствуйте! помогите кто знает как в react задается скорость открытия блока?
Сейчас у меня блок открывается слишкрм быстро
constructor() {
super();
this.state = {
...
Создание и скачивание файла по нажатию на кнопку
Добрый день, Я новичок в js и react. Пытаюсь разобраться в следующем. С бэка на фронт приходит строка. Я хочу, чтобы при нажатии на кнопку создавался файл txt с этой строкой и начиналось его...
Запретить пробелы в input
День добрый! Помогите решить проблемку. Есть input добавления тегов и кнопка чтобы их добавить. Нужно чтобы в инпуте было запрещено вводить пробел. Заранее спасибо)!
формы написаны через...
Ошибка [nodemon] app crashed - waiting for file changes before starting
Не подгружаются посты, а также почти сразу выбивает ошибку TypeError: Failed to fetch в браузере
репозиторий проекта https://github.com/react-in-action/letters-social/tree/chapter-4
ничего в...
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').
при...
Удаление элемента по его id
Добрый день! У меня есть небольшой список, состоящий из отдельных компонент. Мне нужно сделать так, чтобы элемент по которому кликнут сначала выделялся(можно и без этого), а потом и удалялся кнопкой...
i18next способы смены языка
Я сделал два хелпера для создания компонента с переводом слова, всё работает.
import moment from "moment";
import i18next from 'i18next';
import {Translation} from 'react-i18next';
import...
Вывод данных полученных в 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
Всем привет) изучаю реакт и вот вопрос.
С компонентами разобрался, как работает пропс тоже.
Вот теперь вопрос:
Есть какое - то меню например: Работники и Отчет.
В работники мы вносим наши...
Преобразование JSON в массив объектов JS
Всем привет. Помогите, пожалуйста, разобраться с проблемой, так как в голове полная каша и я уже не знаю как мне с этим справиться.
Есть локальный сервер, который я создал, чтобы протестить запросы...
Изменение цвета параграфа
Добрый день! вот задача: Параграфу реализовать выбор цвета.
Можно выбирать из всего спектра (<input type="color" />) или использовать только 5-7 ваших любимых цветов (как в Google Keep).
class App...
Нужна критика кода переключателя темы на React
Здравствуйте, нужна критика кода переключателя темы.
Что сделано не так, что улучшить?
Принимаю любую критику.
gitHub:...
Ошибка "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...
Input type search, событие по кноке очистить
Доброго времени суток.
Ребят подскажите с вопросом, компонент в котором есть input с типом search.
Как обработать событие очистки поля по нажатию на "крестик".
Заранее спасибо большое.
Как сделать анимацию переключения картинки
Доброго времени суток!
Я только учусь и поэтому прошу сильно не ругать за возможные глупости! :)
Делаю учебный проект интернет магазина на React.js + Redux, так вот сделал я компонент по типу...
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...
LocalStorage для корзины товаров (React/Redux)
Привет! Стоит задача, чтобы после перезагрузки данные корзины покупок оставались.
Я пытаюсь это прикрутить через LocalStoge и Redux.
Прошу помочь. Я совсем не понимаю иду ли я в правильном...
Store не хранит состояние
Здравствуйте!
Создал store с помощью hook'ов:
/*code...*/
import { InsuranceItemContext } from './Context/InsuranceItemContext';
import { reducer } from './Reducer/Reducer';
function...
ReactJs изменение цвета после ввода названия цвета
Здравствуйте, извиняюсь, что написал возможно, не самый понятный заголовок, но мне не пришло в голову более подходящее название.
Начал учить Reactjs и застрял перед вроде очевидной, но мною не...
Нет подключения к firebase
Создаю react приложение. Нужна бд firebase. Настроила, но при запуске ошибка: высвечивается сообщение, что подключение не доступно('Error loading the Firebase SDK, check the console.'), затем...
Ошибка масштабируемости карты Leaflet на React
Товарищ, хочу поведать о своей проблеме
Решил я значит сделать карту на Leaflet и React, а она и не работает, точнее криво-косо. Для начала просто вставил пример с офф сайта.(Первая картинка)
...
Как отключить событие фокуса у дочернего элемента?
Как отключить событие фокуса у дочернего элемента?
В коде ниже работает получение фокуса у родительского div и когда он теряется, однако проблема в том, что при клике на дочерний элемент этого div...
Как выполнить AJAX-запрос в React?
Я хочу получить данный с сервера и сохранить их в state.
class NavBar extends React.Component {
constructor(props) {
super(props);
this.state = {
navs: {},
...
Автоматическое нажатие на кнопку через 10 секунд
Добрый день. Есть следующая проблема. Нужно как-то совместить setTimeout и onClick на React JS. Хочется сделать автоматическое нажатие на кнопку через несколько секунд. Рабочий код (нажатие вручную...
Срендерить строку с html
Как срендерить строку с html?
render() {
var title = '<b>Строка</b>';
return (
<div>
{title}
</div>
)
Вынос fetch "post" запроса в отдельный файл
Здравствуйте, подскажите пожалуйста можно ли вынести "post" запрос в отдельный файл?
Я сделал папку с файлом "api.js" и вынес туда "get" запросы, хотел бы узнать как можно вынести и "post" запросы...
Не устанавливается флажок checked (radio button) в onChange не меняется при нажатии на радио кнопку
Здравствуйте, я в React JS новый, хотел бы кое что уточнить
Код есть, в базе данных все корректно меняется при нажатии на кнопку.
Проблема лишь в том, что оно не check-ается по внешнему виду(на...
Можно ли сделать соц сеть на javascript, react.js, ajax, mysql?
можно ли сделать соц сеть на javascript, react.js, ajax, mysql?
Как экранировать кавычки для строки перевода из 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.lazy"
Здравствуйте, не работает "React.lazy", помогите пожалуйста что у мне не так с кодом.
index.jsx
import React, {Suspense} from "react";
import ReactDOM from "react-dom";
//Components
//...
Как вывести двойной ассоциативный массив в react
echo json_encode(
array(
'English' => ,
'French' =>
)
);
render() {
const { error, isLoaded, items } = this.state;
...
Как правильно удалить элемент по таймеру
if (props.error) {
cls.push('fadeIn', 'modalShow')
setTimeout(cls.splice(-2), 3000)
}
Пытаюсь сделать модальное окно, которое после появления висит 2 секунды и исчезает....
Как менять состояние кнопки только у одного конкретного элемента, взятого из массива c map()
Как менять состояние кнопки у одного конкретного элемента, взятого из массива.map(), так, чтобы у других состояние не менялось вместе с ним???
const array = //пример массива
function...
Callback с аргументами
В react приложении есть метод render()
render(
return(
<div className="msu">
{listData.slice(0, 5).map(i => {
switch(i) {
case 0:
...
Плавающая ширина input
Здравствуйте, возник вопрос, может кто-то знает как сделать плавающую ширину инпута? Стили написаны на material ui (material table), сам код на ts (react).
У меня задание таковое, что нужно сделать...
Загрузка изображения из API
Как правильно в React.js преобразовать изображение, полученное из API, - в строку base64?
const App = () => {
const = useState(" ")
useEffect(() => {
...
Как из json файла вывести изображение в react приложение
Начал изучение react столкнулся с проблемой: у меня есть файл json с данными о картинах:
{
"painting" :
и файл paintings.js в котором происходит следущее:
import React, {Component}...
Редактор текста
Как переделать такой код под использование textarea вместо input?
При попытке заменить input на textarea текст перестал редактироваться при потере фокуса
var TextEditComponent =...
Не могу разобраться как вставить ссылку
Здравствуйте у меня возникла проблема у меня есть кнопка мне нужно указать ссылку на эту кнопку но у меня не выходит помогите пожалуйста. Писал по разному в html <a href="http://yandex.ru"...
React не применяются стили
Доброго времени суток! :)
Имею следующую ситуацию - подключаю к js файлу css stylesheet, но стили не применяются. Имена классов в теги добавляются, а стилей нет.
Не добавляются как в таком...
Как редактировать сайт на ReactJS?
Здравствуйте,
я только-только начинаю изучать React и у меня в голове сложилась примерно общая такая структура файлов
На днях мне дали посмотреть на реальный проект. И такой файловой структуры я...
Не работают Route
Всем привет, изучаю React и не могу понять почему не работают пути, localhost3000/user открывается но на ней только navbar
index js
ReactDOM.render(
<React.StrictMode>
<BrowserRouter>
...
SetState не обновляет дочерние компоненты
Всего 2 компонента, родитель и ребёнок для вывода через map в строке 276.
Саме дурацкое, что через консоль лог показывает, что общая цена this.state.amount меняется, map тоже проходит по новому...
ООП в React
Перед изучением react нужно хорошо разбираться в ООП js или сейчас достаточно знать функции js и сразу можно изучать react? С появлением hooks, как я понимаю, он стал более функциональным.
Не отображается выпадающий список
Здравствуйте!
Изучаю React. Возникла необходимость сделать из JSONа многоуровневый select. в консоль выводятся значения, а вот в рендер не получается передать ничего. Помогите, пожалуйста. Что не...
Привязка к value в input
Видел, что привязывают какое-то свойство стейта к value в input, затем каждое событие onChange вызывается функция в которой проводится каждый раз метод setState, для того чтобы сделать поле...
Анимация появления и сокрытия формы в React
Условие: При нажатии на кнопку должна с анимацией появляться форма, данные с которой отправляются на сервер. Введённые ранее данные сохраняются в localStorage, после отправки формы localStorage...
Не работает scss в react-е
Здравствуйте.
Не распознается синтаксис scss у меня в react проекте. Установил его, yarn перезапустил, прописал в webpack.config.js
{
test: /\.scss$/,
use:
...
Сортировка товара
Здравствуйте! Подскажите как сделать сортировку при выборе (названия, цены, рейтинга...)
Есть код,
import React, { useState } from 'react';
import myArray from '../myArray';
import...
Как вытащить данные с backend?
Есть данные с бэка:
Вот как я хочу забрать эти данные:
const = useState()
Как вывести данные из массива JSON?
Есть компонент Item:
return (
<div className="item">
<img src={ image } alt="pizza1" className="item-preview"/>
<h3 className="item-name">{ name }</h3>
<div...
Постраничный вывод данных на react
Привет. Сразу к сути - нужно сделать на react постраничный вывод товаров. Вывод всех товаров на страницу у меня реализован, но нужно чтобы на одной странице было не более 16 товаров. Подскажите...
Как сделать каталог товаров?
Здравствуйте.
У меня такой вопрос.
Есть интернет-магазин, внутри него есть каталог товаров. В каталоге много категорий товаров.
Необходимо сделать следующее: при выборе конкретной категории...
Ошибка Uncaught TypeError: Cannot read property 'value' of undefined
Всем привет! Я новичок в react.
Работаю с jHipster. Пытаюсь получить значение, которое выбрано пользователем в выпадающем списке Select библиотеки Ant Design.
1.Вначале, в событии...
Как перерендерить страницу
Приветствую всех, у меня возникла наверно довольно простая проблема, но я пока начинающий React разработчик. Я пишу свой TodoList и пробую при удалении объекта из массива перерендерить страницу, но...
Залить проект на хостинг
У меня есть проект на реакте. Мне нужно его залить на хостинг. Мне нужно для этого какой то бэкенд или 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. Но так как данные приходят не особо красиво, то у меня...
Redux. Изменение store после удаления элемента
Всем привет.
Разбираюсь с работой React и завис с одним моментом.
Делаю заметки - отобразить из базы (mongodb), добавить новую, удалить.
Сделал все, кроме удаления.
Смысл загвоздки вот в чем:...
Сортировка записей по дате создания
Здравствуйте, на данный момент в пагинации на первой странице ввыводятся старые записи на последней новые. Как отсортировать наоборот? Чтобы на первой странице были новые записи.
<div...
React.JS + Redux. Отправка запроса и чтение данных JSON
Всем привет. Работаю на ASP.NET Core. Подключил React/Redux. И теперь есть одна проблема.
Создал код для подключения к серверу. Но почему-то не могу получить данные JSON.
Вот код actionCreators:
...
Подключение Bootstrap
Доброго времени суток всем!
В одном из скринкастов https://learn.javascript.ru/screencast/react#react-css для знакомства с React увидел, как автор подключает Bootstrap из терминала своего редактора...
Как вывести необходимые данные из массива объектов?
Здравствуйте! Только начал свое знакомство с ReactJS и нужно сделать сайт-тест знаний пользователя по определенной теме.
Есть вот такой state. На данный момент не могу понять, как мне вытащить title...
Почему событие срабатывает только со второго раза?
Пишу клон трелло и событие написано на добавление доски и задачи но почему работает только со второго раза подскажите?
Компонент где происходит событие
export const...
Не могу разобраться: TypeError: Object(.) is not a function
13 |
14 | const store = createStore(rootReducer,
15 | compose(
> 16 | applyMiddleware(thunk.withExtraArgument({getFirebase, getFirestore})),
17 | ...
Не получается поставить 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...
Компонент React Select (Creatable). Как сделать так, чтобы при клике не открывался выпадающий список?
https://react-select.com/creatable
Я хочу сделать так, чтобы выпадающий список с элементами списка открывался только при клике на области, помеченной оранжевым цветом на скриншоте (стрелочка...
Сортировка массива и его отсортированное отображение по клику на кнопку
Есть некий набор информации представленный в массиве. Проблема в том, что не могу реализовать через switch саму сортировку и отображение его же по нажатию на кнопки. Подскажите, пожалуйста , в чем...
Добавить валидацию и отправлять форму, только когда поля заполнены
Допустим такой компонент и к нему тест. куда прописать следует заполнение поля title?
import React from 'react';
export default class Order extends React.Component {
constructor() {
...
Получить значение ключа объекта
Добрый день коллеги.
Получается вот такой код
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import styles from './MovieItem.module.css';
import * as...
Валидация мапы на Yup
Есть некоторый массив ключей
const products = ;
и стейт компонента в виде мапы
import React, { Component } from 'react';
class Animal extends Component {
Кредитный калькулятор
Ищу туториал (не видеоурок), где сказано, как сделать кредитный калькулятор.
Загрузка json файла, используя запрос
Доброго времени суток!
не могу получить json файл используя запрос - возвращает почему-то страницу. помогите разобраться, в чем проблема.
файл load.js
import React from 'react';
export...
При нажатии на кнопку скрыть компонент
На сайте имеются кнопки(1 изображение) при нажатии на лупу должно появляться поле поиска(2 изображение) на месте кнопок и названия
ProgUser.js
const buttons = ;
return (
<App...
Как записать несколько обработчиков событий в "onClick"?
onClick={this.showConsole}
Здравствуйте.
Допустим я имею два или три обработчика событий и я хочу что бы они исполнялись при одном событии.
Как это правильно записать в ...
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......
Аналог querySelectorAll в ReactJS
В нативном js для поиска дум элементов, чтобы узнать их количество я использовал querySelectorAll и lenght для определения сколько таких-то элементов существует у меня с нужным мне классом в данный...
Вызванный компнент функция появляется только после обнвления страницы
Всем привет. Вот начал изучать React JS
Не могу решить одну проблему. Есть 2 файла. App.js и Main.js
App.js
import React, { useState, useEffect,Component} from 'react';
import logo from...
Разделение доступа в react / redux приложении
Есть родительский компонент, в методе componentWillMount проверяю соответствие роли, если роль не подходит делаю редирект
class WrapperAdmin extends Component {
componentWillMount() {
...
Чтение для rectJS из json файла
Всем привет!
Проблема: изменился формат подаваемого на вход json файла и не получается переписать код для нового фрагмента.
Была программа, которая нормально читала данные из json файла для...
Как связать между собой текст списка и чекбокс в нем
Привет всем!есть список состоящий из массива, нужно сделать так что бы текст <li> зачеркивался и отменялось подчеркивание в зависимости от состояния checkbox'а. не могу понять как их связать если при...
ReactJs связать с opencart или другими CMS системами
Как можно связать reactjs с различными CMS системами,
понятно что через API, но нужен конкретный пример и/или ссылка на урок где рассказывается как это делается.
Спасиб.
Метод в Redux реагирует на клик со второго раза
Пробую пример для понимания редакса создал, 2 кнопки инкремент и декремент. Клацаю на любую из этих кнопок значение меняется лишь со второго клика на одну из этих кнопок и после этого же второго...
Ошибка TypeError: this.previousElementSibling is undefined
Почему происходит ошибка ?
Uncaught TypeError: this.previousElementSibling is undefined
class CustomSpinInput extends Component {
onChange = (e) => {
...
Как обновить контент на странице из модального окна с использованием react-router-dom
Существует модальное окно, которое добавляется на страницу, нажатием специальной кнопки, и полностью удаляется со страницы, нажатием на кнопку закрытия. Я хочу добавить <Link /> внутрь модального...
Почему не размонтируется компонент?
Приветствую уважаемых коллег.!
Сначала делаю так:
render() {
return (
<div>
{this.props.conditionToShow && <Component1 />}
</div>
)
В этом случае, всё работает как надо: Каждый раз...
Изменение цвета случайного div'a
Имеется игровое поле с 25 div'ами. По клику на кнопку "Play" случайный div должен окрашиваться в синий цвет.
По клику на div с синим цветом он должен перекраситься в зеленый.
Если клика не было - ...
При клике на ссылку не открывается нужный контент, хотя url меняется.
Привет. При клике на ссылку не открывается нужный контент, хотя url меняется. После перезагрузки все подгружается или когда сам вручную меняю адрес.
header.jsx
import './header.css';
import {...
Axios отправка картинки на сервер
Всем привет. Есть у меня бэк и делаю для него front. Надо сделать форму регистрации, сделать, но она не отправляет изображение. Выводит ошибку 415. Просидел и продолбался 2 часа. Но нечего не...
Изменение состояния useState
Есть такой код:
import React, { useState } from 'react'
const Task = () => {
const = useState( {name: 'Иван', age: 25, show: false} );
const handleClick = () => {
...
Передача значений между компонентами с использованием redux.
Добрый день.
Необходимо передать переменную из одного компонента в другой, появилась идея использовать в качестве буфера Redux, но мне кажется, что это не совсем хорошая идея.
Подскажите, это...
Передача функции от Родителя к Ребенку
У родителя есть функция
updateText() {}
нужно передать ее ребенку, чтобы там использовать - вызвать
Изначально рендрю вот так
<Task key={i} index={i}>
так ошибок не находит
но когда...
Вставить на страницу строку с тегами
Добрый день.
Подскажите, как вставить на страницу строку с тегами?
let header = 'qqq <b>eee</b> rrr'
return(
<div className='container'>
{header}
</div>
...
Ошибка с babel
Как видите не получается поправить версию бабеля пробовал пару решений безрезультатно, у кого какие идеи???
ERROR in ./src/index.js
Module build failed (from...
Отправка JSON и form-data одним запросом?
Добрый день, у меня есть форма с фотографией и текстовыми полями. Можно ли в одном POST запросе отправить и картинку и json, т.е, чтобы "Content-Type" был form-data и JSON
Галерея с модальным окном(и миниатюрами картинок)
Не могу найти галерею с модальным окном и миниатюрами для картинок
https://jfcaiceo.github.io/react-lightbox-component/
Этот пакет хорош, но он принимает сами картинки и уменьшает их через ксс, а...
Разница между React и React native
Я хочу начать освоение React для фрондента, но при этом хотел бы иметь возможность писать мобильные приложения. И поэтому у меня вопрос: эти фреймворки сильно отличаются друг от друга? Много ли...
Оплата с использованием Stripe
Необходимо подключить оплату к сайту ,выбрал Stripe.При первой записи все работает ,но тут стандартная форма,так же нашел уже готовый вариант с готовой формой с оф библиотеки ,Но не понятно как...
Как сделать такой всплывающий React компонент?
Как правильно сделать такой простой React компонент? Без библиотек.
При нажатии на кнопку, выводится информация к примеру "зарегистрирован"......
Нужен максимально простой компонент, который...
Обновление данных firebase в React приложении
Доброго времени суток!)
Интегрирую в React-приложение типа todo-list подключение к Firebase.
Получаю данные и добавляю их в state в componentDidMount().
Добавляю новый item в БД в...
Не работает правильно Маска номера телефона
Здравствуйте. Не работает правильно Маска номера телефона. Когда пишу в поле номера телефона, то в state-те получаю артефакты, но не могу понять почему. Функция-маска, работает, но как только...
Модальное окно с кастомным компонентом
Добрый день.
У меня имеется react + redux приложение. В рамках приложения описан компонент модального окна, который вставлен в корень страницы и отображается на основе состояния из redux. Модалка...
Обновление данных в форме
Доброго времени суток, появился вопрос по react'у.
Есть код:
export default class HelloWorldApp extends React.Component {
constructor(props) {
super(props);
this.state...
Как изменить свойство при клике
Здравствуйте! Приведите пожалуйста пример (на функциональных компонентах) изменения одного из свойств при клике.
К примеру, React отрендерил (есть массив объектов) через map все элементы массива:...
Как избежать перерисовки незатрагиваемых компонентов
При нажатии кнопки меняется текст сообщения. Как избежать перерисовки не участвующего в этом взаимодействии грида ?
Пример на codesandbox.io
Код привожу и здесь
import React, { useState,...
Как отловить событие перехода на страницу с redux?
Приложение создано с помощью react creat app, сверху поставлен redux и router. Хочу узнать как поймать событие перехода по ссылкам(компонент Link к компонентам-страница) внутри приложения.
useState поменять местами элементы массива
Здравствуйте!!!
Подскажите, допустим есть массив cards, с помощь драг энд дропа я захватил элемент с id 1 и перетащил на элемент 4. Как поменять их местами в setCards?(обновить состояние в onDrop)
...
Не отображается ReactJS
Только начал учить библиотеку React так сразу же не задалось.
В качестве рабочей среды использую Visual Studio code. Решил написать простенький код по выводу надписи.
Файл с jsx:
import React...
Компоненты и пропсы
Добрый день!
У меня есть массив с названиями животных, это выводится на экран с помощью картинок, я могу отсортировать массив картинок по группам животных - это работает, у меня один стэйт для...
Использование 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...
React.js с Material-ui
Привет ребята! Возник вопрос и проблема с React.js. Я написал код который должен вывести мне кнопки в стиле Material-ui, однако браузер выдает ошибку: Uncaught ReferenceError: require is not defined....
Массив из компонентов!
Надо вывести репозитории GitHub (например, только их имена). Есть компонент для одного, отдельного, репозитория.
Как вывести весь массив репозиториев?
Главный компонент App.js:
import React...
Наложение изображений
Привет.
Как подступиться посоветуйте, если сталкивались:
нужно получить два изображения, наложить одно на другое и сохранить в третье.
Есть мысли? СПАСИБО
Плавное изменение текста столбца таблицы при получении новых значений
Допустим есть массив
{
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". Как это...
ReactJS. Почему не работает код? В консоли нет ошибок!
Почему не работает код риакта?
В консоле нет ошибок, и на екране нету текста который я хочу вывести
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
...
Практика react-redux
Хотел я значит сделать игру, так как более менее основы знаю react+redux, а итоге такого наворотил, что понял, нужна практика и много практики, от малой до великой, посовейте, плиз, как практиковать...
react redux отследить изменение
Добры день.
Есть redux в котором есть поле "areaListType" и когда я его меняю, везде, где происходит render значения меняются,
но мне надо также отправить изменённое состояние в API.
Отправка...
React компонент без рендера и получение содержимого контейнера
class UserManager extends React.Component {
constructor(props) {
super(props);
this.state = {
value: null,
};
Сколько времени займет изучение фреймворка?(извините за тупой сами знаете что)
Знаю, вопрос глупый, у всех по разному и всё такое, кто-то может сказать хоть примерно нужно на изучение фрейма для поиска работы и конечно же полезные ссылки и книги для изучения не помешали бы,...
Изменение маски ввода input в зависимости от выбранного значения в select-box
Здравствуйте, подскажите (возможно есть готовый пример) как реализовать следующую задачу, имеется форма построенная компонентом formik , в которой используется react-select, на форме размещен...
Нужны ли знания Typescript если идти на на Junior UI Web Dev (React)?
Здравствуйте, нужны ли знания Typescript если идти на на Junior UI Web Dev (React)?
Redux form попытка очистить конкретный field
Всем привет, есть такая форма.
<form className={classes.listField} onSubmit={props.handleSubmit}>
<Field validate = {} name = "filmName" type="text" label = "Название фильма" component...
Всё тот любимый undefined
Здравствуйте!
Не понимаю сути этой ошибки:
При передачи данных в store пишет, что у меня undefined(хотя там есть данные)(проблемы с getPockeBlock):
import React from 'react';
import...
Unexpected string concatenation of literals no-useless-concat
Здравствуйте, уважаемые форумчане! Не могу никак избавиться от предупреждения в заголовке темы.
Вот код:
browser_update_link = "https://www.google.ru/search?q=" + `Как обновить браузер...
React и Api: вывод элементов.
У меня есть API, с помощью которого я вывожу продукты. У меня продукты в API разделены на категории. И у меня есть кнопки категорий к этим продуктам, но они повторяются. Помогите пожалуйста: как...
react дождаться выполнения асинхронных функций
Добрый день.
У меня две асинхронные функции
ServiceApi.getMatgrouplist(access_token)
.then((data) => matgroupListSuccess(data))
.catch((err) =>...
Сделать виджет комментариев
Напишите виджет комментариев на React со следующей функциональностью:
1. Отображение списка комментариев: автор, текст, дата и время
2. Добавление нового комментария (поля для ввода: имя...
Множественный импорт SVG файлов
Всем доброго времени суток!
Вводная по задаче:
Есть около 100 SVG файлов. Требуется расположить в виде таблички эти SVG-изображения. При клике на карточку с изображением, нужно поменять цвет...
Не могу сделать редирект
Здравствуйте.
Я использую React Routing, по этому все пути у меня содержат символ решетки после хоста. Вероятно по этому возникает следующая проблемма.
Я нахожусь на странице вида...
Ошибка при создании React проекта: Maximum call stack size exceeded
Здравствуйте. Я новичок в React. Решил следуя туториалу настроить проект. Сначала запустил команду
npm i -g create-react-app
Ни одной ошибки не произошло.
Далее, запустил команду
create-react-app...
Как правильно передать setState от ребенка к родителю
Всем привет. Мне нужно передать функцию setImages из компонента CardSlider (ребенка) компоненту Card (родителю). Вот часть моего кода:
let Card = () => {
// Много другого кода
let...
React как сделать анимацию прозрачности при клике?
React как сделать анимацию прозрачности при клике?
https://reactcommunity.org/react-transition-group/transition
Тут, конечно, целый пример, но я не понял как подгрузить бибилиотеки с анимками....
Не рендерится компонент
Я имею следующий код:
import './Form.css'
import React, { Component } from 'react'
import axios from 'axios'
import Comment from "../comment/Comment";
export default class Form extends...
Проблема с отображением картинки baseimage64 в gmail
Всем Доброго вечера,
Не могу понять, почему в письме gmail не отображается конвертированная картинка imagebase64 .
В отличии от gmail, outlook и другие почтовые клиенты отображают imagebase64
...
multiple select
Здравствуйте! подскажите, как правильно создать многозначный select в react.
Я сделал по-своему, работает правильно, но 'глючит' при выборе-отмене.
class FlavorForm extends React.Component {...
Почему синтаксис "useMemo" в моем коде вызывает предупреждение?
Здравствуйте, почему синтаксис "useMemo" в моем коде вызывает предупреждение?
Сколько зависимостей я б ненаписал всеравно это предупреждение.
Как это устранить?
Нету предупреждения только когда...
Морской бой на react
Решил сделать Морской бой на реакте. Была данная тема или нет. Но я не нашел(
Работа с DOM в React и на чистом JS
С Днём Победы! Пишут о том что работа React быстрее с DOM, чем на чистом JS, так как он работает с Virtul Dom, а только потом вносит изменения в реальный. Я не могу понять в чём это выражается?...
Подключение глобальной БД в приложении React Native на андроид
Всем привет, пишу приложение для андроид на React Native. Нужно подключить файл бд и делать запросы с получением данных. Подключение сделал, ошибок с ним будто нет, но вот сделать запрос и получить...
Вытащить JWT токен
Ребят, подскажите кто знает можно ли как-то вытащить токен из Response Headers в Authorization и в дальнейшем вместо поля auth.login(data.token) указать правильное поле моего полученного токена. ...
Виджет комментариев переделать с react на redux
вот этот код нужно переделать в redux с компонентами редьюсерами и так далее
долго уже пытаюсь никак не получаеться(
App.js
import React, { Component } from 'react'
import { format } from...
где можно преобразовать дату(строку), которая приходит из input, в дату(число), чтобы дату задать в setFullYear
const FirstPage = (props) => {
const = useState('');
const = useState('');
const = useState('');
const getData = () => {
debugger
let nowDate = Math.round(new...
Посоветуйте курсы по React JS
Народ, всем привет. Вот недавно начал изучать React JS вот по этим видео: https://www.youtube.com/playlist?list=PLIcAMDxr6tpoShAiU0Nh_nBtg19XWbCql
Подскажите, какие материалы изучали лично вы,...
Как превратить переданные props в state?
У меня есть react контейнер который ходит по апи за данными.
Данные рендерятся на странице и они же прокидываются по средствам props в модальное окно для редактирования вместе с колбеками для полей....
Пример динамического импорта в react приложении
Всем привет. Подскажите где можно посмотреть пример динамического импорта компонентов в реакт приложении.
Читал доку вебпака https://webpack.js.org/guides/code-splitting/ не совсем понял как это...
Конвертер из JSX в HTML+JS+CSS
Есть проект на reactJS, нужно просто конвертировать его в статичный сайт HTML+JS+CSS. Как это сделать?
Предпросмотр картинок перед отправкой на сервер
Проблема заключается в том, что я хочу перед отправкой на сервер, сделать предпросмотр картинок.
Я подумал, что запихну все в Хук и он будет обновляться. Но хук видит только один созданный элемент....
Проитерировать массив вместе с фото в объекте
Мне нужна ваша помощь. Я пытаюсь добавить в массив фотографии, а затем проитерировать его. Фотографии у меня находится в отдельной папке. Но у меня не отображается фото, отображается только иконка...
Events.js:167 throw er; // Unhandled 'error' event
В общем, я создал приложение и поставил сверху express
https://dev.to/loujaybee/using-create-react-app-with-express
Затем я озаботился тем, что файл server.js не обновляется по хот модулю и решил...
Асинхронный useState
Здравствуйте!!!
У меня вопрос в связи с тем что useState асинхронный.
Например я хочу задизаблить кнопку дождаться выполнения запросов и раздизеблить кнопку сделав редирект.
Хочу узнать можно ли...
Передать json через пропс в другой компонент и вятынуть данные
Доброго времени суток.
Подскажите в вопросе.
Получаю данный из запроса (JSON), затем пытаюсь передать его в другой компонент через props, но не могу потом вытащить из него значение.
...
React Хранение переменных при обновлении страницы
Добрый день.
Я получаю от сервера token и он необходим мне на каждой "странице", которая обращается к API.
Где можно хранить этот token, что бы при нажатие кнопки "Обновить" в браузере он не...
Приближение и отдаление элемента находящегося в overflow: scroll с позиционированием на мышку
Всем добрый, пару дней уже мучаюсь с такой задачей:
нужно реализовать просмотр pdf файлов и картинок в браузере.
1-а из функциональностей такого просмотра должна быть "приближение и отдаление"...
Кто передал в функцию props
Доброго времени суток.
Посмотрите, пожалуйста, скрин из консоли.
В пропсах там сидят данные.
Не могу понять откуда они взялись.
Функция withSuspense вызывается в компоненте App в 39-ой строке....
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...
Роутинг React.js
Здравствуйте! Возник вопрос: как работать с многоуровневой маршрутизацией. У меня компонент не отрисовывается, да и я не понял как вообще работать правильно с маршрутизацией.
Т.е. если у нас...
Работа с асинхронными функциями
Всем привет, недавно начал учить react и столкнулся с такой проблемой
Есть компонент Map в котором 2 метода. Метод getPosition - асинхронный запрос на сервер для определения местоположения...
Ошибка npm start в webstorm
Доброго времени суток,вопрос от новичка: почему выходит ошибка и как ее решить?
npm ERR! Windows_NT 10.0.16299
npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Progra
m...
Подключение React, babel в Webstorm
Уже 3 дня не удается правильно настроить react и Webstorm. Таже проблема з babel.
Пожалуйста, напишите как грамотно ето сделать, или киньте ссылку на туториал.
Как сделать чтобы функция вызывалась только после первого рендеринга?
Здравствуйте, подскажите как сделать чтобы функция extraFunc вызывалась только после первого рендеринга(функция не должна срабатывать каждый раз при нажатии на счетчик)?
import React, {useState}...
React-теры подскажите (сортировка)
Коллеги подскажите как сделать из этого сортировку по возрастанию и убыванию. Пы\сы: гуглил очень много
import React, { Component } from "react";
import ProductData from "../test.json";
...
Реализация больших данных React
Всем привет, сразу к делу:
Задача стоит так, есть Главная страница, где отображается список всех товаров, есть кнопка добавить. Потом на странице добавить, есть поля (Название и порядка 30 полей для...
Отправка формы по нажатию на чекбокс
Здравствуйте! Проблема такова: есть форма, в форме текстовое поле, 3 чекбокса и кнопка отправить.
На сервер отправляется post запрос с данными текстового поля и состояниями чекбокса. Хочу также,...
Удаление по id
Есть проект, в нем надо реализовать добавление продукта и удаление. При попытке удалить происходит ошибка, не могу понять в чем проблема. FrontEnd - ReactJS, BackEnd - NodeJs, Database - MySQL.
...
Откуда тут массив с Промисами?
Здравствуйте!
Скажите пожалуйста, почему вот этот кусок кода мне выдаёт массив промисов вместо массива объектов со свойствами и одним новым свойством, которое я пытаюсь добавить с помощью этого же...
React Thunk и обновление компонентов
Здравтсвуйте!
Разбираюсь в redux-thunk.
export const someAction = () => {
return dispatch => {
dispatch(actions.action1());
dispatch(actions.action2());
}
Заменить цвет границ checkbox на свой в Ant Design
Доброго времени суток.
Использую Ant Design
Подскажите как изменить стандартный цвет границ у checkbox на свой при наведении на него курсором?
Мне нужно, чтобы при наведении на содержимое checkbox...
Несовместимость React-Router и React-Bootstrap
Добрый день,
Пишу маленький проект и в качестве дизайна решил использовать React-Bootstrap.
При создании Навигации сайта использовал Nav. Я хочу при клике на любое меню рендерить с помощью...
Настройка роутинга
Здравствуйте!
Стоит задача при изменении некой переменной показывать различные компоненты. По сути авторизация, при успехе которой пользователю открывается админка.
Сейчас сделано так:
В App.js я...
JS React Как сравнивать значение формы со строкой (e.targer.value == '?')
Есть форма с двумя кнопками и событие. Не работает сравнение e.targer.value с value заданное кнопкам.
onTaskButton(e){
e.preventDefault();
if (e.targer.value == 'But1') {
...
Как разделить прод и дев версии в реакт приложении ?
У меня есть приложение на реакте, я хочу что бы когда билдилась версия был один путь, а при разработке другой.
У меня путь прописывается в двух файлах:
config.js
const config = {
url:...
Клиентская часть на ReactJS
Посмотрел туториалы по реакту. Все сводится к тому что есть некий index.html, а в нем какой-то элемент типо <div id="root"></div>. А потом мы рендерим туда что-то.
Необходимо написать приложение...
Проблема с кликом вне модального окна
У меня есть два компонента Title и Post.
По нажатию на ссылку в компоненте Title у меня должно открыться модальное окно и по хорошему должно закрыться если я нажму вне модального окна.
И проблема...
Сайт погоды / apiWeather
Доброго дня суток)
Начал изучать ReactJs после продвинутого JS(может я так думаю), у меня стала делема:
У меня файлы разбиты на компоненты и я не могу изменить в input-е число напрямум(чтоб и в...
LocalStorage очищается после обновления страницы
Работаю с LocalStorage впервые и если использовать обычный метод localStorage.setItem, то все работает. Однако нужно подключить функию с другого файла. И вроде оно создается, однако после обновления...
Фронт (React) не отправляет запрос на бэк (Spring Boot)
Приветствую всех.
Задеплоил фронт-энд и бек-энд как два разных приложения (со своими адресами) на Heroku.
Адрес фронта: https://front-for-app.herokuapp.com.
Адрес бэка:...
Не загружается изображение
Подскажите, почему не получается импортировать картинку?
import ava from './s1200.jpeg';
<NavLink to={path}><img src={ava}/>{this.props.name}</NavLink>
Изображение находится в той же папке, что и...
Добавить в уже существующий объект свойство и положить в него объект
У меня имеется такая вложенность в редьюсере
initialState = {
prop1: {
props2: {
prop3: {id: '123', text: '222'},
prop4: {id: '321', text:...
В компоненте react не обновляются input
https://i.ibb.co/QFp1QDm/testauto.png
Реализую CRUD приложение. Добавление и удаление реализовал. Возник вопрос с обновлением. Для этого:
1) При нажатии кнопки "Редакт" передаю в компанент `App`...
не работает кнопка
Почему при нажатии на кнопку ничего не происходит
Раньше работало( теперь перестало
import React from 'react'
import Invoices from './Invoices';
import Header from './Header'
function...
React redux получить изменённое значение
Добрый день.
При работе возник такой вопрос:
По клике на кнопку я вызываю функцию, которая меняет значение в redux stor, всё отлично, она меняется и делается правильные рендер, но как мне её...
Динамическая таблица с select
Есть таблица:
<table>
{
showTime && group &&<tr>
<td>1</td>
<td>2</td>
</tr>
}
Выделение пользователем области на изображении
Для курсовой необходимо сделать мобильное приложение на React-Native позволяющее пользователю выделять некоторую прямоугольную область в изображении из галереи и сохранять информацию об области...
Не работает роутинг в продакшене create-react-app
Добрый день,
Не работает роутинг в продакшен режиме create-react-app, в деве все нормально работает,
подскажите пожалуйста что подправить.
Index.js:
import {BrowserRouter} from...
Как отобразить как props img у компонента?
Всем доброго времени суток!
Начал разбираться с Реактом и делаю маленькое простенькое приложение.
Один компонент должен использоваться несколько раз, но меняется текст и картинка для него.
С...
Запись данных в объект
доброго времени суток, столкнулся с проблемой по JavaScript, React!
вот мой код:
Зафиксировать кнопку ReactJS
Помогите, пожалуйста. Как мне в ReactJS сделать липкую или неподвижную кнопку, при скроллинге страницы?
React и не только
Добрый вечер, представьте, есть человек, который делал лендинги и работал с html/css немного js/jquery, php только для многостраничников и отсылки форм на почту. И прилетело ему задание, интересное,...
Обновление свойств компонентов на обновление состояния родителя
Компонент Clock
отрисовывается 500 раз. Внутри тикает таймер и когда компонент один - все ОК.
Но когда их 500 (по всем временным зонам из либы moment-timezone) - все плохо (страница сильно грузит...
Не работает функция jquery внутри компонента react
Здраствуйте, помогите найти причину, не работает функция jquery внутри компонента на react , вот так выглядит компонентimport React from 'react';
class CaroselPagination extends React.Component {
...
Не компилируется компонент
Здравствуйте. Я новичок в ReactJS, только изучаю его. Я написала небольшой компонент, но при компилации через webpack babel получаю ошибку и не понимаю, то неправильно я написала ? Подскажите,...
Отправка данных формы на Firebase
Приветстсвую! У меня задача отправить данные из формы на Firebase.
Я использую Redux Form.
Получил данные из формы в виде объекта. Написал скрипт для отправки данных в базу данные, но ничего не...
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...
React-native работа с expo FileSystem
Всем привет!
Возможно вопрос глупый, и даже очень, но решения найти не могу, даже нагуглить.
Мое приложение сделано через react-native init myProject (пока работаю под андроид)
Нашел...
Не работает push на главную страницу после регистрации
Здраствуйте! помогите найти в чем ошибка, мне нужно после того как данные с инпута записались localStorage сделать push на главную страницу. но почему то не срабатывает, что не так?...
Контролируемые компоненты в React и постоянный рендеринг
Есть код добавления item'ов к ul.
state = {
value: '',
items: ,
};
addItem() {
this.setState((prevState) => {
const items = ;
Не могу передвинуть ползунок <input type=range /> из-за react-indiana-drag-scroll
Здравствуйте, уважаемые форумчане! Столкнулся со следующей проблемой. Есть фон в несколько экранов со звездами, на нем есть планеты, которые отображаются в центре фона (центральный экран - экран...
Не могу отправить 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>
...
Бесконечный вызов dispatch
Всем добрейшего времени суток. Столкнулся с неприятной ситуацией, когда начинают бесконечно вызываться два диспатча, если один из них я кидаю в then у промиса. В общем:
есть Thunk
export const...
Не пойму, как работает FormData
здрасьте
есть форма redux-form, из которой я пытаюсь достать данные(ну с этим всё ок) и запихать эти данные в FormData(а вот тут пиндыр):
<McsEditForm
...
Асинхронный запрос
Запрашиваю данные с БД, потом экспортирую, и когда испортирую в другой файл, то приходит promise. Как сделать, чтобы не promise приходил, а данные?
const elementsData = () => {
const dataDb =...
Посоветуйте практический курс на React redux/ react
Всем привет. Столкнулся с тем, что мне не хватает практики. Подскажите какой практический курс по реакту.
типо...
Как добавить картинки через props в React Carousel Image Gallery?
Как добавить картинки через props в React Carousel Image Gallery ?
Redux-Semantic-UI-React
Фронтенд разработка для веб традиционно делится на оформление (HTML/CSS) и интерактивность (JS). Но на самом деле всё это тесно связано между собой, а при использовании React так вообще, его...
Не подгружается сайт на реакте в iframe
Добрый день! Пишу js обвязку для сайта, который должен крутится в iframe, но почему-то сайт в теге iframe не подгружается полностью. Сайт, который нужно крутить в фрейме - написан с использованием...
Redux-toolkit, как обновлять slice внутри другого slice
Добрый день, использую в React приложении Redux-toolkit и есть некоторые проблемы.
Имеется хранилище с вызовом модального окна с информацией об ошибки. Туда нужно передать информацию (title, true...
При нажатие кнопки ничего не происходит
В первый раз работают с web из-за задания в вузе.У меня есть кнопка "Логин" и при нажатие на нее не открывается модальное окно(oneClick прописал). Так вот не могу понять почему нет ожидаемого...
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...
Отрисовка по условию
Мне нужно отрисовать по условию дочерний компонент <Page1/>.
В текущей версии моего кода он не отображается. Если вставить в html разметку, то ошибок нет, компонент отрисовывается нормально.
Я...
Module not found: Can't resolve
Не могу понять, почему не находит модуль. Когда как в другом файле по этому же пути всё хорошо импортируется..
Ошибка в 14 строке (прикрепил скриншот, чтобы видели папки и файлы)
Как подписаться на изменение store в redux?
Как правильно подписаться на изменение данных в определённом месте store, в другом месте сайта если произошло изменение будет отправляться запрос при заходе на страницу....
subscribe наверное не...
Undefined API React
Добрый день! Разрабатываю простенькое crud приложение c интеграцией с готовым backend. Возникла проблема: данные, которые отправляются на сервер получаются Undefined и не отображаются в итоговой...
Рендеринг таблиц с большим количеством элементов
Собственно, кто сталкивался, нужно отображать данные в таблице, когда элементов в таблице 200-300 все нормально, но когда их более 1000, все начинает сильно зависать, могу дабивить пагинацию, но в...
Redux создание элемента по клику на кнопке
Нужно сделать так, чтобы при клике на кнопку New создавалось самым верхним новое пустое поле для заполнения, а после внесения всех данных, при нажатии на Add, эти данные должны уже "закрепиться" в...
Можно ли использовать вызов функции генерации id в reducer
Здравствуйте. Есть вопрос. Можно ли использовать вызов функции генерации id (7ст) в reducer (допустим что существует только Redux core)?
//............................................
switch...
Ошибка при создании проекта React с помощью пакета create-react-app
Привет. Пытаюсь изучать JavaScript. Дошёл до библиотеки React. Пытаюсь создать первое приложение. Ввожу в терминале команду npx create-react-app my-app и получаю результат:
npx...
Как передать значение из useEffect
У меня есть хук для получения результата
const = useState(0);
в одном из case я его использую
case '=':
if (text === '0') return
const operator: string =...
Как получить свойства дочерних компонентов из родительского компонента?
Вот код
https://jsfiddle.net/BossBossEx/n5u2wwjg/66204/
В строке 28 я меняю значение свойства chosen у компонента, по которому происходит клик мыши. У него же в 32 строке я беру родителя и прохожу...
Передать полученный с сервера initialState в store
Добрый вечер!
Помогите, пожалуйста, разобраться со store.
Когда я запускаю проект, в файле App.tsx создается store.
В reducer передается initialState с начальными значениями.
Я пытаюсь...
Пытаюсь подключить библиотеку Date-fns
Всем привет, пытаюсь подключить библиотеку js date-fns. Делаю все по официальным документам , но выводит ошибку - RangeError: Invalid time value. Подскажите как исправить.
React hydrate и ssr Did not expect server HTML to contain
Здравствуйте!!!
Пытаюсь по крупицам из интернета собрать билд который позволит делать Server Side Rendering. Сейчас столкнулся с проблемой
Warning: Did not expect server HTML to contain a <div> in...
Фильтр для сайта
Нужно сделать вот такой фильтр для сайта с использование React, Redux, данные брать с JSON. Подскажите с чего начать, возможно есть у кого примеры, наработки или источники где описано создание...
Сохранение стейтов при перезагрузке браузера
Подскажите как сохранить стейты в браузере
Пагинация API GitHub
Помогите с пагинацией с API GitHub.
App.js:
import React from 'react';
import Pagination from './components/pagination';
import Info from './components/info';
import Reposit from...
Заставить страницу обновиться после onClick event
Я хочу что бы после того как происхоидит event (юзер логинится или разлогинивается) кнопка менялась. Как только юзер вошел <button onClick={logOut}>Logout</button>, как только вышел <button...
Отмена действия привязанного на клик по строке в таблице
Здравствуйте.
Имеется таблица с 3 столбцами, последний из которых содержит кнопку. На клик по строке привязано действие. Но мне не нужно выполнять это действие при нажатии на кнопку, нужно...
Прочитать вложенный объект внутри Json
При запросе отправляю объект Data:
public class Data
{
public Data() =>
NestedData = new NestedData();
public int Value { get; set; } = 999;
public...
Ошибка теста Jest Enzyme
Здравствуйте!
Начала писать тесты для react-компонента (С помощью Jest и Enzyme), но появилась вот такая вот досадная ошибка.
С чем она может быть связана? Помогите, пожалуйста)
Ошибка:
Test...
Как правильно сделать заглушку для сайта на React JS?
У меня на сайте есть заглушка по типу "перейдите в play market \ app store" и скачайте приложение...
Она должна появляться при ширине экрана меньше 1000px. Я просто создал этот компонент, повешал...
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...
Как получать расстояние с карты. yandex-react-maps
Начал учиться писать карты для пользователя. Есть постоянная точка, нужно поставить еще один маркер, сделать между ними маршрут и получить расстояние между ними. Как это реализовать, есть ли понятная...
Передача параметров между компонентами
Доброго времени суток.
Решил познакомиться с реактом, сделав простенький интернет-магазин и столкнулся с такой проблемой:
у меня есть несколько роутов, главная страница, 404, логин и т.д.
На...
Не работает обработчик события
Здравия всем!
Изучаю реакт, знаю, что через ref обработчики не надо делать
Но данная тема входит в обучение, и надо самому сделать обработчик на кнопку таким образом
Вот код, и он не...
Можно ли в данном случае заменить getElementById на обращение через refs? Как это должно работать?
Здравствуйте!
Есть вот такие вот функции в компоненте.
Функция getFilters получает на вход массив выбранных атрибутов и отображает в виде тест + кнопка. Когда пользователь нажимает на кнопку,...
Выделение текста мышкой в textarea
Если создать html страничку без react, и кинуть на нее textarea, тогда получается выделять текст в нем мышкой
Если же создать страничку через react, тогда выделение мышкой недоступно
Думал все...
Не запускается приложение на телефоне
Почему не запускается код в react native, исправьте ошибки пожалуйста
import React from "react";
function f(value) {
return value.split("").reverse().join("");
}
export default function...
Использование одного компонента несколько раз
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...
Почему context возвращает false?
Здравствуйте. Почему когда я пытаюсь вставить значение переменной из контекста в useState (например так: useState(context.name)) у меня контекст возвращает false. А когда я пытаюсь получить...
Почему в ReactJS Visual Studio не подсвечивается синтаксис?
Такая проблемма когда я пиши просто на js у меня весь синтаксис все подсвечивает а когда взял html код для react js у меня синтаксис в visial studio перестал подсвечивать помогите пожалуйста ! ...
Яндекс карта в реакт приложении
Всем привет. Помогите пожалуйста решить следующий вопрос ломаю голову ни как не могу найти в чем проблема! Вообщем пытаюсь сделать на сайте прямоугольник с картой создаю 350 на 350рх и в него...
Почему при попытке обновить state из useEffect он не обновляется?
Почему при попытке обновить tabsFields из useEffect он не обновляется?
// Apollo Client запрос к GraphQL серверу
const { data, error, loading } =...
Ошибка: "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) => {...
flex in react
Пытаюсь сверстать простой сайт, макет до банальности прост.
<div className={'m-div'}>
<div className={'main-content'}>
main
</div>
<div...
Изменение backgroundcolor DIVa
Случайному DIVу, выбранному с помощью math.random по нажатию button присвоен синий цвет. Как в этом же случайном DIVе по клику мышки изменить цвет на другой (скажем,-зеленый)?
import React, {...
Массив в рендере(неужели всегда надо перерисовывать?)
Понимаю, малось стрёмный вопрос, просто я сейчас делаю такую штуку, в которой по сути есть таблица, у которой всегда должно быть одинаковое количество tr, но в зависимости от ряда приходящих в json...
Секундомер
здравствуйте, подскажите как исправить отображение чисел при выводе. (должны выводится 00:00,00 а выводятся в столбик)
(Основной код)
mport React, {useState} from 'react';
import { Text, View,...
[React Native] Как только я изменяю текст в TextInput он сразу же восстанавливается назад.
Всем, привет.
Я недавно начал заниматься разработкой на React Native и столкнулся с проблемой. Я через парсинг JSON получаю текст и пытаюсь поместить его в TextInput. Все хорошо парсится и TextInput...
Компонент обертка
Можно ли в реакте создавать компоненты обертки?
Есть вот у меня компонент:
class HomeHeader extends Component {
render() {
return (
<header className="bg-gray-900 h-20 w-full...
ReactJS. Запретить второе нажатие на div.
Доброго времени суток! :)
На div блок навешен onClick, определенный React компоненте. Вопрос: можно ли его убрать? Т.е. предотвратить вторую обработку onClick.
Заранее благодарю за любые советы...
Загрузка приложения на React в iframe
Всем привет. Есть приложение React на typescript и я хочу его запустить в iframe со стороны другого React приложения. Я беру бандл подгружаемого приложения указываю на него путь. Но там есть функция...
Не получается определить "useLocation hook" из "React Router"
Здравствуйте. Столкнулся с такой проблемой.
Нужно стало воспользоватся useLocation в файле, но когда я только определил (pages.js) ст 51 мне выпадает такая ошибка:
Error: Invalid hook call....
React адаптивное меню
У меня есть работающее адаптивное меню на React. Когда я уменьшаю размер страницы до адаптивного размера (450px) у меня оно показывается, как уже меню открыто, а надо чтобы при уменьшении оно сначала...
Импорт библиотек из node_modules
Доброго дня, дорогие форумчане. Подскажите пожалуйста, столкнулся с такой задачей и не пойму как её правильно решить.
Ситуация следующая:
Пишу проект на React с применением TypeScript (js...
Двойной рендеринг
Добрый день, начинаю изучать react, сделал авторизацию через Firebase, после того как зашёл на сайт и при обновлении страницы сначала прогруживаются кнопки, а потом показывает сообщение, что я уже...
React-native Получение данных из БД MySQL в <Text>
Добрый день!
Подскажите пожалуйста как я могу получить данные из бд MySQL при помощи php в Text
Например я хочу получить кол-во заказов пользователя: select count(ordername) from order where...
React Redux, хранить данные локально или глобально
Добрый вечер, вопрос таков: с сервера приходит список объектов, он используется только для отображения в компоненте, стоит ли этот список хранить в store? Если нет, то тогда как оставить...
Никак не могу понять зачем react'у нужен node.
Никак не могу понять зачем react'у нужен node, ведь он работает на стороне клиента. Может кто нибудь понятно объяснить? В гугле был ничего не нашел.
Create-react-app: Unexpected end of JSON input while parsing...
Пытался загрузить библиотеки react но вылазит ошибка...
Как сделать такую галерею на React JS?
Можете подсказать как сделать компонент такой галереи (фото ниже), или может уже есть такой-же пример...
Что-то я найти не смог...
Не срабатывает alert()
Почему не срабатывает alert при нажатии на button " Save "?
Component 1
import React from 'react';
import MainView from './components/MainView';
import CreateInvoiceForm from...
Необходимо создать три кнопки во внутренней странице (во 2о странице)
VK Mini Apps ("web") на React.
Есть страница. На странице 5 активных кнопок (Тренировки, Питание, Музыка, Спортпитание, Спорттовары, Мои результаты).
При нажатии на эти кнопки, мы переходим на...
Objects are not valid as a React child (found: TypeError: response[0].includes is not a function). REACT
Всем привет. Создаю страничку на React. Смысл работы примерно таков : пользователь заходит, выбирает из первой таблицы типы аккаунтов-> нажимает на кнопку поиска аккаунтов и ему выпадает другая...
ReactJS - чтобы работал без инета
здравствуйте, только поинтересовался, что такое ReactJS, в примере
<script src="https://unpkg.com/react@16/umd/react.production.min.js" crossorigin></script>
<script...
ReactJS - Ошибка в консоли.
код с ошибкой
в консоле вижу что проблема в начальном состоянии, но я не пойму что не так
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Components</title>
<script...
Создание div с его вложенными элементами
Добрый,
компонент получает массив цветов, нужно сделать вот так
<div style={{border:"solid 2px " + this.props.array}}>
<div style={{border:"solid 2px " +...
Форма регистрации: как сделать редирект при вводе определенных параметров в форме?
Всем привет. не могу разобраться как сделать редирект при вводе определенных параметров в форме. Форма material ui. Роутинг подключил через RouterLink. по кнопке при нажатии (независимо от того что...
React Js
Добрый день, хочу получить пару советов и наставлений от людей, которые имеют достаточно много опыта в JS, HTML и CSS и т.п.
Дело в том, что на данный момент жизни для себя решил, что хочу...
Зачем в примере в setState стрелочная функция?
После пхп и пайтона синтаксис js / react с трудом дается.
А курс по реакту еще и на английском. Потому где-то что-то упустил, просьба пояснить, почему надо писать так:
<button
...
Ошибка You should not use NavLink outside a Router
Доброго всем времени суток! Изучаю react, добрался до темы роутинга и при попытке создать NavLink в меню получаю следующую ошибку:
./node_modules/react-router-dom/modules/NavLink.js
SyntaxError:...
Где можно быстро выучить React JS?
Ребята нужно быстро(1 месяц) выучить React JS , но Фронта нечего не знаю, но знаю C++,C# и Java , где можно быстро выучить React JS , какие сайты рекомендуете или книги или что-то другое(на русском...
Как передать идентификатор элемента, который запускает событие onClick
Допустим есть некий div:
<div onClick={ () => dispatch({ type: DIV_CLICKED, obj: ВОТ ЧТО ТУТ ДОЛЖНО БЫТЬ??? }) }></div>
Подскажите, пожалуйста, что мне сюда такое вписать, чтобы в итоге...
Сканирование штрих кодов с веб-камеры @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>
Как добавить карту в React приложении?
Делаю интернет-магазин.
Нужно на нескольких страницах создать карту с местонахождением магазина.
То есть не просто картинку в виде скриншота, а чтобы с картой можно было взаимодействовать.
Т.е....
Большое количество импортов - плохо?
Господа! Кто давно работает в React? Помогите разобраться. Есть некий файл. В нем слишком много импорта:
import mother from './images/mother.jpg';
import mouse from './images/mouse.png';
import...
Работа с LocaStorage
Здравствуйте, столкнулся с некой проблемой, у меня есть приложение на React, где через api ключ выводятся фильмы, есть возможность добавить фильм в избранное, сделано с помощью localStorage , но вот...
События в react js
Вот мне немного неясен момент с this._inputElement.value. В рендере оно заменится на event.target.value? Если да, то почему бы не написать это сразу?
import React, { Component } from 'react';...
CSS transition, max-height
Доброго времени суток.
Имею ситуацию, которую не могу понять как разрешить. Имеется боковая панель, содержащая в себе список с элементами разной высоты (зависит от длины текста). При сворачивании...
Хороший пет-проект на Реакт для резюме
Всем привет.
Ищу свою первую работу в IT, фронтендером, основа моего стека - JS+React. Т.к. никогда раньше в IT не работал, в резюме есть только пет-проекты. И в связи с этим встал вопрос - какой...
React this.handleLoginClick = this.handleLoginClick.bind(this);
Добрый день.
Читаю реакт документацию
https://ru.react.js.org/docs/conditional-rendering.html
и не могу понять, зачем нужна эта строчка кода?
На мой взгляд, можно обойтись и без неё.
Если...
Css в нескольких файлах для приложения на react native
Поступил запрос на то, что бы разделить ксс по компонентам для моб приложения на react native. Я немного не понял смысла это делать, т.к. стили как правило пишут "обобщенными" что бы блокам с одной и...
Иконка для сайта на next.js не устанавливается
при начальной загрузке страницы появляется,и тут же исчезает.
называется favicon.ico. находится в папках app и public.
подключается к проекту в корневом лояуте:
const Layout = ({children}) => {
...
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...
useState initial state или useEffect
Здравствуйте!!!
Я так понял что можно в useState передать функцию и стелать както так:
const = useState<IInitialValues>(() => {
const saved = localStorage.getItem('articles') || '';...
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".
Эта ошибка почему то появляется и...
React Render Performance ?
Какими средствами можно отслеживать рендер react-компонентов?
В ручную каждому компоненту писать что-то подобное не удобно
render() {
console.warn((this.name || this.displayName) + ' was...
Styled-components - к children компонента не применяется стиль
Всем привет!
Возникла проблема со styled-components - стиль не применяется к компоненту:
Компонент, который будет стилизоваться:
import React from "react";
export const...
Как реализовать функцию редактирования заметок в моем случае ?
Работаю над тестовым заданием - нужно написать список заметок на реакте.
Прикрепляю ссылку на проект на gitHub, для лучшего понимания ситуации....
Создать posts по кнопке "submit"
Всем привет, не как не могу разобрать с posts в ReactJS
Нужно по кнопке "Add posts" каждый раз добавлять новый пост. т. е постов должно быть несколько. вел текст нажал на кнопку первый пост, ввел...
Как удалить определённый элемент по кнопке, который до этого был также создан по другой кнопке
у меня есть проблема, когда я создаю элементы по кнопке, вроде всё хорошо, у элементов в том числе есть кнопка, которая должна удалить эту группу элементов из массива по индексу, но она всегда...
Как работает setState()?
Доброго времени суток!
Поясните, пожалуйста как работает метод setState() в данном коде.
import React from "react";
import ReactDOM from "react-dom";
const UNIT = {
KPH: 'Км/ч',
MPH:...
Three.js - переключение между 2 камерами-3d это перспективная и 2d ортографическая
Здравствуйте.Работаю на реакте в 3d библиотекой THREE-JS.Задача-ставить цилиндр по клику мышкой на пол(изначально строится помещение).Происходит переключение между 2 камерами-3d это перспективная и...
Создание ссылки на whats app
Добрый день,
Подскажите, как сделать ссылку открывающую в новом окне диалог в вотсапе с разными клиентами при клике на их номер телефона?
Спасибо
genClientPhones(phones){
return(
...
Кука уходит в Redis, но не уходит в браузер
Здравствуйте, уважаемые форумчане! Никак не могу понять, что не так. Раньше все работало. Я создаю куку на сервере, но она не уходит в браузер, уходит только в БД на сервере.
Код на клиенте:
...
React обновить график
Как нарисовать график я понялю как кпримеру с этой библиотекой https://www.youtube.com/watch?v=28ZbeLWmfiQ
рисуется вроде. Но допустим у меня есть сторонее апи предостовляющее данные по разным...
Паттерны React
Добрый день.
Подскажите, как сделать обёртки для следующего кода:
import React from 'react';
class Page extends React.Component{
Answer = {
value : ''
Условный рендеринг в react native c FlatList
У меня есть массив с объектами (пример ниже) и нужно с помощью рендерить на странице, но рендер должен происходить только тех объектов, у которых поле type = 0. Если честно, то не совсем пойму как...
React + VCS
Недавно начал изучать React, хочу его использовать для своего простого проекта.
Так как я вынужден довольно часто ездить, у меня 2 рабочих машины + ноутбук. Все проекты которые я раньне...
Добавление внешнего файла .js к App.js
Здравствуйте, уважаемые форумчане! Никак не могу подключить внешний файл test.js к проекту. Как это можно сделать? Пробовал использовать react-helmet, ничего не получается. Вот код:
test.js
var...
При подключении библиотеки "fs" консоль бьёт ошибку fs.readFile is not a function
Такая проблема наблюдается как с родной библиотекой так и в библиотеках, которые юзают её.
Пробовал накатывать вручную её, но успехом не увенчалось.
Есть ли какие-то мысли почему может быть??
Редюсер вызывается два раза
При таком коде reducer вызывался 2 раза:
const = useReducer((state, action) => {
changeNow('journal')
if (action.pupil) {
state.pupils.push(action.pupil)
...
npm run build выдает странную ошибку
npm run build выдает странную ошибку
"." не является внутренней или внешней
командой, исполняемой программой или пакетным файлом.
в package.json команда выглядит так
"scripts": {
...
Mobx не загружается в проект
Доброго времени суток. Начал изучение mobx, пытаюсь установить п проект npm i mobx-react-lite выдает ошибку! Может кто то сталкивался, помогите плиз! Ошибка выглядет так
npm ERR! code ERESOLVE...
Можно ли сразу сгенерировать js из jsx?
Как я понимаю, сам реакт в итоге всё равно компилит js код из jsx файла при каждой загрузке страницы. А можно ли как-то сразу получать js в файлах и грузить именно их?
Добавлено через 29 минут
Ну...
Нужен совет, как добавить событие onBlur на два тега?
Я для практики пишу поиск стран
У меня есть компонента SearchForm, у которой есть input, где и надо вводить названия стран. При каждом вводе срабатывает onChange и выводиться список стран под этим...
Visual Studio Code Проблемы с React
Здраствуйте, не нащёл где лучше разместить тему
создал экзепляр create-react-app
открыл в visual studio code
попытался создать простейший компонент. создал src->FComponent.js
вбил код
import...
NavLink
Здравствуйте !
Не могу понять почему при смене адреса не назначается ссылке active class . Меняется адрес в адресной строке происходит переход но class не меняется. Ошибок в консоле нет
...
Валидация формы через React Bootstrap
Добрый день,
Помогите с валидацией формы React Bootstrap. Использую вот этот подход.
function FormExample() {
const = useState(false);
const handleSubmit = (event) => {
const...
Как добавить класс при клике
Подскажите как при клике на ссылку добавить для нее класс, а при клике на другой - убрать
import './App.css';
import { BrowserRouter, Link, Route } from 'react-router-dom';
import { Main }...
Как наложит поверх видео прямоугольник ?
Дали тестовое задание ,
- В момент возникновения события в плеере поверх видео должен рисоваться зелёный прямоугольник,
соответствующий области, определённой в событии. Прямоугольник должен...
Проблема с UseEffect. Выполняется несколько раз при рендеринги странице
Здравствуйте, недавно начал разбираться с React и столкнулся с такой проблемой, что при использовании useEffect страница отрендеривается 2 раза.
Возьмем к примеру одну из страниц.
import React,...
Ошибка webpack с использованием eslint
Здравствуйте. Возможно что-то не так делаю или понимаю. Пытаюсь настроить eslint в проекте React + TypeScript. У меня вроде eslint работает корректно. То есть ищет ошибки, Знает про...
combineReducers создает вложенный объект
Добрый день.
Возникла проблема, что combineReducers получая в state объект, возвращает его же но вложенным еще в один объект.
Мой код:
phrases-reducer.tsx
const initialState = {dialogs :...
Create-react-app development mode с php
Каким образом можно при разработке ссылаться на бакэнд файлы php?
вписать ссылку "./controller/HomeController.php" работает только с продакшен
...
Передача props нескольким компонентам
Есть один родительский класс с некоторыми данными, есть несколько других классов. Могу ли я передать значение пропсов родительского класса нескольким компонентам? Что-то вроде render() {return (...
Взять данные из JSON, не зная структуры
Приветствую! Занялся React.js. Есть задача, получать данные с сервера в виде JSON файла и выдавать их в таблицу. Проблема в том, что файл может приходить разных видов с разными полями у объектов, но...
MobX. Можно ли импортировать store в модель другого store, если нужно использовать данные обоих stores?
Mobx. Подскажите, пожалуйста, как правильно описать структуру кода, когда нужно чтобы в модели одного store использовались данные другого store.
/stores
RetailersStore.ts
...
redux запрос на сервер - разъясните основы
Добрый день. Помогите разобраться начинающему. Начал изучать Redux. При изучении начальное состояние state в редьюсере
мы пишем сами (например initialState). И в зависимости от type меняем его...
Как подключить onClickOutside к компоненту-классу с редуксом?
https://github.com/Pomax/react-onclickoutside
Как подключить onClickOutside к компоненту-классу с редуксом?
Я думал, что будет достаточно compose
import './Header.scss';
import {logout}...
Отображение несколько видео на странице
Всем привет!
Пытаюсь добавить несколько видео друг за другом на одну страницу
import VideoPlayer from 'react-video-js-player'
...
<div className="Test_Video">
<VideoPlayer
...
Enum не читается в блоке условий (if else, switch)
Доброго дня и чистого кода всем.
Пытаюсь работать в React с Enum, полученным с сервера (Spring) в качестве ответа в процессе загрузки файла в базу данных. Прлучаю этот ответ и веду его до тех пор,...
Обновление таблицы после удаления объекта
Доброе время суток! У меня есть следующая таблица:
return <Table striped>
<thead className="thead-dark">
<tr>
<th>Табельный номер</th>
<th>ФИО</th>
...
Как вывести информацию в label
Необходимо чтобы в label выводилось значение count после нажатия на кнопку -,+,reset
Код:
import logo from './logo.svg';
import './App.css';
import React from 'react';
function App() {
let...
собственный redux, как написать useSelector?
Всем привет, столкнулся с интересным заданием и решил проверить себя. Нужно написать собственную реализацию редакса. Сейчас проблема в том, что не понимаю как подписаться на обновление стора
ссылка...
Не могу передать в пропсы состояние из хука
Передаю по клику индекс элемента в редьюсер, меняю в массиве состояние по индексу(true, false) и возвращаю массив состояний, нужно ли еще использовать какой-нибудь хук для отлавливания изменений в...
axios не выводит json полученный от API django
Всем привет ещё раз.
У меня есть bec написанный на django. У меня есть фронт написанный на React( ну как есть, он в написание)
И сейчас возникла проблема, если я возьму json данные полученные от...
React Redux и useSelector
Здравствуйте!!!
Подскажите на каком этапе нужно преобразовывать данные например добавить юзеру поле профайл если он админ:
Я это могу сделать в экшене получив ответ от апи и записать в стор, а могу...
React+Vite, ошибка Uncaught SyntaxError: Unexpected token '<'
Всем здравствуйте.Делаю проект на реакте и для меню создал вот такой словарь
export const privateRoutes = {
"Методики": ,
"3D": ,
"Справочник РТП": ,
"СТП-2.0": ,
...
Как вывести все объекты на страницу, ссылка запроса должна меняться по нажатию кнопки, т.к. данные на разных страницах
Всем привет, я новичок и дико туплю, помогите плз)
По запросу https://swapi.dev/api/planets/?page=1, выводится 10 планет на страницу, не могу дописать так, чтобы по нажатию кнопки , запрос был с...
А вот как можно реализовать тамагочи на React, canvas (данные сайта хранятся в mongodb)?
Подкиньте пожалуйста идей,если можно. Делаю сайт,хочу добавить туда тамагочи. На данный момент есть двигающийся персонаж в канвасе на фоне,меняющимся в зависимости от погодных условий. Хочу добавить...
Как убрать 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 с такими...
document.addEventListener не видет функции класса
Добрый день.
Добавляю подписку на события нажатия клавиши
componentDidMount(){
document.addEventListener("keydown", this.moveKey);
}
moveKey(e) {
Почему не обновляется переменная
Мне нужно доделать проект, который был написан с помощью mobx. У меня почему-то не обновляется значение переменной (value={state.backOfficeTable1.description.currentMonth}) как в обычной useState,...
Как грамотно сказать кнопочке, к какому элементу списка она принадлежит?
Компонент берет в пропс массив и через .мап создает список, каждый элемент списка содержит форму с двумя кнопками, которые должны влиять на определенное значение массива.
ПРИМЕР:
(ли1
знач мас 1...
Удалить пробелы методам trim()
Здравствуйте подскажите пожалуй как реализовать. Есть input Добавления тегов и кнопка, нужно с помощью метода trim() сделать так чтобы если инпут содержит пробелы я не мог нажать кнопку добавить...
Проблема с Redux DevTools
Не знаю если в правильной месте задаю вопрос, но проблема с расширением для браузера Redux Devtools, пару недель назад пользуясь этим расширением я на что то нажал, и теперь все что я вижу это...
Проблема с отображением результата запроса
Добрый день! Перейду сразу к сути. У меня есть готовый API от imdb. Делаю цикличный запрос, сохраняю каждый результат запроса в state. Показываю результат по шаблону. Но проблема именно в последнем. ...
React асинхронное выполнение запросов к API
Добрый день.
Помогите разобраться
Необходимо загрузить два набора данных с сервера, потом проделать над ними манипуляции.
Я думал, что Promise.all сначала ждёт отработку всего, что внутри, а...
Bootstrap сработал до того как его "попросили"?
Здравствуйте!
В этом учебном проекте используется react и bootsrap.
Почему до того как мы задали className элементу Bootstrap уже включился и применил свои стили(смотрите первый и второй скрин)?...
Можно ли сделать контроллер на манер фреймворков?
Можно ли сделать контроллер на манер фреймворков(laravel,yii2)?
Просто пока кажется, что придётся все урл на компоненты завязывать.
const AppRouter = () => (
<Router>
<div>
...
React-native студенческий проект
Всем привет!
Ищу разработчика для совместной разработки нашего мобильного приложения (можно сказать студенческий проект). Пишите кому будет интересна эта тема, чтобы поделиться опытом и...
Как экспортировать функцию из класса?
Как экспортировать функцию (resolveFileNameWithType), которая находится внутри класса? Если вынесу за пределы класса, то аргумент type теряется.
export class DownloadReportComponent extends...
При выполнении задания(при клике) удаляется совсем другое задание, только в визуализации
Здравствуйте.
Когда я кликаю(на кнопку Выполнено) на любом задании, почему-то всегда удаляется последнее задание, хотя в консоли всё правильно происходит. При перезагрузки страницы всё становится на...
Теги <select> и <option> Выпадающий список
Доброго времени суток. Хочу реализовать, что-то вроде таблицы, которая будет состоят из трёх столбцов и тут же есть выпадающий список, в котором есть выбор, по каким параметрам сделать сортировку: по...
Не обновляется компонент при setState (JS React)
Есть массив в стейте, он копируется в masdop, после чего обновляется пушем, и юзается сетСтейт, почему не происходит отрисовка согласно изменению стейта?
//Конструктор
var tkJSON2 =...
Пререрисовка таблицы после изменения состояния
Доброго времени суток!
Есть таблица, в которой есть данные о товаре, которые хранятся в localStorage. При нажатии на крестик происходит удаление, массив в localStorage уменьшается, но перерисовки...
Индекс "нажатого" элемента
Делаю элементы, при клике меняющие стиль. Вот код
index.js
class App extends React.Component {
constructor(props) {
super(props);
this.handleClick = this.handleClick.bind(this);
...
Получение ссылки на DOM для компонентов material-ui
Всем привет. Подскажите такой момент. Есть компонент SELECT из материал, я сделал выбор в списке и хочу потом получать выбранное значение не записывая в стейт, а вынимая его из DOM. То есть брать с...
Как делать запросы из react к базе ms sql если проект на ACP NET?
Есть проект C# ACP NET, в котором фронтенд будет переводится на react.js. До этого использовался Entity Framework. Как делать запросы из react к базе ms sql?
Вынести логику из компонента
Столкнулся с интересным вопросом, что делать , когда внутри компонента необходимо провести некоторый алгоритм, результат которого после в компоненте вывести?
function Welcome(props) {
const...
Мониторить один из чатов в телеграме, при поступлении сообщения отобразить его и проиграть звуковой сигнал.
Стоит такая задача: нужно мониторить один из чатов в телеграме, при поступлении сообщения в этот чат, необходимо на компьютере отобразить сообщение из чата и звуковой сигнал проиграть.
Как ограничить количество цифр после запятой js?
Помогите пожалуйста ограничить количество цифр после запятой!
<p className="Card-Click-dis">{item.price * item.count / 100 * 10} ₽</p>
Идет такой подсчет, что цена умножается на количество и...
ReactJS: Установка проекта
Здравствуйте, я только начал изучать ReactJS и хотел бы разобраться с реальных примеров.
Подскажите, как установить проект?
Я выбрал этот, но не знаю, как его установить.
...
Парсинг ссылок в чате
Всем привет!
Как можно реализовать парсинг URL (например из сообщения) в кликабельную ссылку и при этом не использовать dangerouslySetInnerHTML?
Проблема с шириной столбцов в Ag-grid
Можно ли как-то сделать так, чтобы столбцы растягивались до конца без белых пустот как на изображении? Или же как-то динамически их растягивать?
Как начинать с того шага на котором остановились в input range?
Добрый вечер, подскажите алгоритм сохранения шага в input range, чтобы при повторном движении у нас учитывался предыдущий шаг.
То есть если вести мышкой по высоте блока вверх или вниз у нас меняется...
Таймер обратного отсчёта
React-компонент - таймер обратного отсчёта.
Компонент должен работать по следующему алгоритму:
На экране представлено специальное текстовое поле и кнопка «Начать!»;
Пользователь вводит...
Правильно ли я написал функцию "reducer"?
Здравствуйте, правильно ли я написал функцию "reducer"? (ст 22)
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
...
Не работает синтаксис мутации в "createSlice" Redux
Здравствуйте, не работает синтаксис мутации в "createSlice" Redux.
Вот к примеру (38 - 41ст) кусок рабочего кода(когда нажимаете на хрестик удаления задания, то выполняется этот кусок), но состояние...
Навигация по элементам в React
Добрый день! Интересует такой вопрос: раньше я работал с приложением для SmartTV на AngularJS, для навигации использовалась эта библиотека:
...
Redux передача своих пропсов
class CasesContainer extends React.Component {
filterAndSort() {
let arr = this.props.casesInfo.map((elem,index) => {
return <Case key={index}/>
});
return arr;
}
...
Выбор даты в React Data Grid
В таблицу React Data Grid в колонку с датой надо добавить выпадающий календарь для выбора даты. Пробовал прикрутить в качестве editor-a React DatePicker, но он не подходит видимо.
Инициализация state в Redux
Доброго времени суток.
В своем проекте я использую Redux, и метод reducer().
Как правильно сделать "предзагрузку" данных в initialState? Я имею в виду общий подход.
В приложении есть:
const...
Как копировать файлы которые собирает webpack?
Webpack сделал сборку файлов bundle.js (Home profile shop)
на локальном диске.
А мне нужно эти файлы положить на наш внутренний сервер в 2 папки
/dev_1/
/dev_2/
То есть попросту...
Парсинг файлов
Я плохо разбираюсь в React, но мне необходимо сделать парсинг одного типа файлов.
для этого я создал в компонент для загрузки файлов
<input type="file" onChange={ (e) =>...
Как вывести ключи и значения массива в HTML элементах?
Реализовать компонент, который будет принимать один параметр в формате JSON и отображать вложенный список. Пример конфига:
{
“item1”: {
“nestedItem1”: null,
“nestedItem1”: {
...
Книги по React "для продвинутых"
Всем привет. С 2015 года работаю фуллстеком (прерываясь на чистый бэк). Использовал многие библиотеки и фреймворки. Сейчас работаю с Реактом. Я легко справляюсь с текущими задачами, но у меня грейд...
Страница требует refresh после перехода по ссылке
Здравствуйте, уважаемые форумчане! Никак не могу решить проблему, описанную в заголовке темы. Вот код:
import React, { PureComponent } from 'react';
import {Switch, Route} from...
Переделать export default в export
Добрый день.
Помогите переделать export default в export
import {connect} from 'react-redux';
const test = () => {
console.log('Test1');
}
const test2 = () => {
...
Как вывести значение в DOM которое ожидается в промисе?
Здравствуйте, как вывести значение в DOM которое ожидается в промисе?
Причина ошибки мне понятна, но я не знаю как вывести в дом значения функции trueMessage.
Подскажите пожалуйста что делать в...
добавить к ссылке при onClick сообщение alert
Решаю учебную задачу и почему-то никак не выходит прикрутить к onClick сообщение.
Подскажите пожалуйста, кто знает хоть как примерно это сделать. Чего-то я совсем запуталась...
import...
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...
Фильтр через query params
Прошу поделится какой-нибудь статьёй, или решением как можно сделать фильтр фильмов или вообще любой фильтр, чтобы в строке браузера показывалось что-то такое...
Работа с Redux-form
Доброго времени суток.
Помогите понять ("прощупать") как попал объект с данными собранными из form в качестве аргумента formData функции onSubmit?
p/s Пожалуйста, не пишите, что redux-form...
Перерисовка одного элемента списка, а не целиком
У меня такой вопрос: Есть список в стейте. Через map вывожу каждый элемент. Меняю значение одного элемента (копирую стейт, меняю одно значение и возвращаю объект через setState) и получаю ререндер...
Mobx strict mode
Добрый день, объясните, пожалуйста, почему выходит предупреждение Since strict-mode is enabled, changing (observed) observable values without using an action is not allowed. Tried to modify:...
TypeError: Cannot destructure property 'error' of 'undefined' as it is undefined
Привет!
Есть следующая ошибка: TypeError: Cannot destructure property 'error' of 'undefined' as it is undefined.
Не подскажите где она может быть или в чём заключается? Спасибо!
Вызов fetch из реакт приложения через proxy
Друзья, может кто-нибудь по шагам пояснить последовательность действий, чтобы с локальной машины я мог делать post запросы на сторонний сервер через proxy? Запросы необходимы к адресу...
JS React обновление классового компонента
Следующая ситуация: при рендере классовый компонент реакта получает на вход параметром массив. Один из методов класса добавляет в этот массив элемент, как перерисовать компонент с учетом изменения...
Передача объекта в react
Не могу разобраться с массивом объектов.
Пытаюсь передать массив объектов в дочерний элемент, делаю так
state = {
rightAnswers: false
};
outAnswers = (q, a) => {
const...
Добавить элементы на страницу
Всем привет! Только вчера начал осваивать react js и не могу разобраться, как добавить сразу несколько элементов на страницу. То есть есть код, который выводит карту и отмечает на ней точки из json...
setInterval не вызывает функцию
Добрый день.
Не могу победить кусок:
function gameOn () {
timerId = setInterval(pressCell, delay);
}
Параметры url в rescr-router-dom
Здравствуйте. Подскажите пожалуйста. Изучаю react-router. Всё было славно пока не дошел до url в формате /что-то тут (например, mysite.ru/about/34). Не работает. Роутится на стороне клиента.
...
Стилизация динамической верстки
Доброго времени суток!
Пытаюсь сделать следующее: есть такие данные для формирования объекта:
строка с уже готовой версткой: "<div id="test">test markup</div>"
объект со стилями: { fontSize:...
Приложение не загружается
Доброго времени суток! Я пока только начинаю изучать React и столкнулся со следующей проблемой...
Приложение не загружается на локальном сервере... Наверное компоненты моего проекта не...
Ошибка 404 при обновлении страницы, React router
Я в своем сайте использовал react-router-dom и у меня выскакивает ошибка при обновлении второстепенных страниц.
Подскажите в чем может быть дело. Я полагаю что в где-то в роутере.
Ошибка 404 Page...
Как импортировать CSS из JSON в React?
С сервера в JSON приходят данные:
{
"A": {
"cell": 5,
},
"B": {
"cell": 10,
},
react-yandex-maps проблема с balloonContent
добрый день. не получается вывести описание для точек на карте, перерыл весь интернет, все найденное не отрабатывает. вот фрагмент кода:
<div style={{ width: "80%", height: "100vh", marginLeft:...
Axios post ошибка 415
Всем привет. Пишу post запрос на регистрацию и у меня всё время ошибка 415. Как её решить? Я с ней сижу уже 2 дня и нечего не пойму.
Вот мой код:
import React from 'react';
import axios from...
Как вызвать перерендер компонента при изменении store?
Всем привет. У меня не есть самостоятельная реализация redux (разбираюсь с чужим кодом). И у меня возникла следующая проблема.
https://codepen.io/gsdev99/pen/pYqmRr
Когда в reducer...
Вызвать из компонента1 другой компонент2. Уловный рендеринг и состояния
Господа, добрый вечер. Что-то я совсем запутался.
У меня есть множество компонентов(это маркеры на карте), по контекстному клику которых я вызываю диалог для каждого компонента свой и передаю данные...
Аналог hover css на react
Добрый день! У меня несколько блоков одного класса, формирующихся в цикле. Подскажите, как мне сделать, чтобы при наведении мыши у меня применялся стиль, только к конкретному блоку? Сейчас...
Ежедневник на react native
Думаем как сделать ежедневник в приложении, надо ли верстать все элементы, типа чисел календаря с попапами событий, которые должны в них произойти или есть какие плагины календаря/ежедневника,...
Uncaught (in promise) TypeError
По нажатию на кнопку срабатывает событие авторизации пользователя.
async function getUserInfo(nomcard) {
await MainApi.getUserInfo(nomcard)
.then((res) => {
if (res.status...
Назначение this.props.children в фрагменте кода
Никак не могу разобраться что делает и зачем в коде this.props.children и что оно делает. Понял лишь что без него дочерние компоненты не загружаются на страницу уже пару ресурсов перечитал и...
React-router не отрисовывает компоненты
У меня есть код, который берет данные из API товаров и отрисовываю их. Кроме пытаюсь сделать переходы между страницами. Но есть проблема. Когда пытаюсь сделать переход на каждый отдельный товар,...
Превратить однострочный код в многострочный
Есть файл comment.react.bundle.js, где писали код и сделали его в 1 строку. Можно ли его как-нибудь, с помощью программы, сайта или чего-либо еще, не расставляя переносы вручную, превратить в...
[React] Как правильно получать components с сервера?
Есть проект. Он старенький.
Расчёт идёт на то что бы перевести его с сервер-сайд рендринга, на фронт-сайд...
Сейчас он работает на react и .net (mvc\web api)
Чтобы полностью переехать с mvc на web...
Правильное отображение данных при сортировке
Всем Привет! Кто может подсказать как правильнее мне применить мою сортировку в React. У меня есть список данных которые я получаю из Firebase books1 они изначально отображаются друг за другом в...
Не получается запустить приложение реакт на сервере Ubuntu
Доброго времени суток друзья. Впервые столкнулся с такой проблемой, на локалке приложение хорошо работает компелируется, Но как переношу на vps выдает ошибку
Failed to compile.
...
Redux-saga
У меня есть файл с API запросами на локальный сервер
import * as axios from "axios";
class Api {
constructor() {
this.instance = axios.create({
withCredentials: true,
...
Redux изменение состояния
Добрый день! Скажите, как можно изменить состояние (initialState)? Можно ли это сделать с помощью .push() или ка-то по-другому? Но при использовании .push() браузер выдает ошибку, что это не функция...
Как работает useRef()
function Counter() {
const = useState(0)
const prevCountRef = useRef();
useEffect(() => {
prevCountRef.current = count
})
const prevCount = prevCountRef.current
Компоненты не перерисовываются после изменения состояния Redux
Здравствуйте. Я пытаюсь составить список дел. Я взял UI из примера Redux и начал писать логику по-своему. Я столкнулся с проблемой. Итак, проблема в том, что когда я нажимаю кнопку «Mark All...
Вывод списка документов в виде таблицы с полями
Нужно с C++ переползать на REACT и Java скрипты
По работе такое задание
https://github.com/bystrobank/react-test-app
PS
Пожалуйста
Изменяю state но компонент не рендерится!
Приветствую Знатоки! При изменении массива не рендерится компонент <TaskPanel />, сильно не пинайте я только вливарекчусь :)
file App.js
import React from "react";
import Header from...
Изменение state
Здравствуйте, столкнулся с такой проблемой:
Есть компонент App, внутри которого есть state.value. Нужно c помощью компонента Child при нажатии в нем на условный элемент (div,p и т.д.) изменить...
Не работают хуки
import React, {useState} from "react";
function App() {
const =useState(0);
function incr() {
setСount(count +1);
}
function decr() {
Выдает ошибку
подскажите пожалуйста что делаю не так ? только начал изучать React Native JS
есть два файла
№ 1 App.js
import { StatusBar } from 'expo-status-bar';
import React from 'react';
import {...
react-router-dom не работает
Решил разобраться с роутингом, но столкнулся с преградой
App.js
import Nav from './components/Nav';
import {Route, Router, Routes} from 'react-router-dom'
import Home from './pages/Home';
...
Верхнее меню c правой стороны на antd
Привет всем пытаюсь создать навигацыонное меню с правой стороны на ant desin библиотеке.
В документацыи ни одного примера с меню на правой стороне.
Приведу пример кода:
<Menu...
Вопрос по Выражению. Подскажите, пожалуйста, что за определение компонента: { logout }?
Привет, подскажите пожалуйста, что за определение компонента такое:
const Logout = () => (
<AuthConsumer>
{({ logout }) => (
<button className="btn btn-sm btn-default"...
Как правильно организовать работу с ролями в react/redux приложении?
В приложении есть роли(admin, manager, user и т.д.) у всех разный набор разрешений. На бэке все замечательно разрулил. Не могу понять как в redux приложении организовать всё. Как должен быть...
Нахождение площади треугольника равнобедренного (или равностороннего)
Подскажите, как можно было бы указать формулу, если нужно будет найти два треугольника на выбор.
const = useState("r="); // нужно будет указать несколько констант для сторон треугольника?
...
Компонент с запросом данных по интервалу не выполняет запрос при первом рендере
Добрый день, господа!
ОПИСАНИЕ ПРОБЛЕМЫ: У меня есть простой компонент с запросом данных по интервалу в useEffect без зависимостей.
Идея в том, что при первом рендере устанавливается интервал, по...
Как отрендерить объекты в объекте?
Есть объект obj, в нём объекты, они буду создаваться динамически, по клику, например будет так
const obj = {
id: {
id:1,
bla: "flerflkewfl"
}
}
React, Json сравнение
добрый день, возникла проблема не могу второй день решить.
есть два Reduces, один отвечает за данные для магазина, другой за данные для вкладки популярные. Во вкладке популярные есть кнопки на...
React.js Переполнение стека
Добрый день.
Есть код для создания простого списка, пункты которого помещены в массив:
export default class Menu extends React.Component {
constructor() {
super();
this.state = {
...
Изменить стейт родителя без родительского обработчика
import React, { Component } from 'react';
import { Child } from '../..';
class Parent extends Component {
state = {
values: ''
}
Запускаю простенькую страницу ошибка 404
Сижу с ubuntu 22.04,, 3-й день пытаюсь сделать сайт до этого получилось написать простой фронт как задание. Прошло 2 недели и чтобы я не пытался запустить ошибка 404 не понимаю что делать. Исправил...
Наследование функционального компонента
Здравствуйте дорогие ребята. Мне в react очень не хватает наследования... искала разные примеры и статьи в интернете, но предлагают везде композицию вместо наследования. Наверное я так не научилась...
Пустые угловые скобки в React
Привет. Разбираюсь с React-ом. Пока использую обычный JavaScript.
Из элементов React сделаны компоненты. Компоненты возвращают (return) элементы React. Написал несколько простых функциональных...
Где лучше писать "css" код в "React"?
Как задавать стили в React через className или через style={}?
Что лучше?
Сайт запускается из под корневой папки
Запускаю проект через npm start, на страницу выводится ошибка "Unexpected Application Error!
404 Not Found
������ Hey developer ������
You can provide a way better UX than this when your app...
JSON объект распознается как пустой массив
Добрый день, форумчане!
При попытке переслать с бэка объект JObject от Newtonsoft на фронт я вижу на бэке, что он выглядит как
{
"properties":
{
{
"prop1":"1",
...
Как отрендерить даные полученные localhost:3001
Имеется компонент React , который через fetch получает данные с http://localhost:3001/db_datas
mport React from 'react'
import InvoiceItem from './InvoiceItem'
class Invoices extends...
Получить ссылку на DOM элемент из списка SELECT material-ui
Приветствую. Такой вопрос. Есть элемент SELECT из материала, хочу при отрытом выпадающем списке получить доступ к дом элементу этого списка. Я получил доступ, но на мой взгляд решение какое-то не...
Чат с ИИ
Приветствую, уважаемые программисты! Делал тестовое в одну фирму, но запаздал со сроками из-за здоровья, попал в больницу, вакансию закрыли. Все равно решил доделать, т.к. тестовое было интересным....
Как добавить название изображения из массива?
const ImgBlock = () => {
const imgs = ;
return (
<div className='imgBlock'>
<img className='ch' src='img/{imgs}' alt="test" />
</div>
);
}
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...
CellInput - инпут из ячеек
Всем привет. Сделал компонент - инпут, состоящий из ячеек. Хотелось бы увидеть обоснованную критику кода и альтернативные, более простые и правильные пути. Заранее спасибо.
Главный компонент Cell...
Как переделать функциональный компонент в классовый?
import React from "react";
import { useState } from "react";
const Cart=({name,img,price,addProduct})=>{
const =useState(false)
const onClickPlus=()=>{
setIsAdd(isAdd)
...
Как передать пропсы в children корневого layout Next.js
Добрый вечер!
Вот корневой layout.js в Next.js:
export default function RootLayout({ children }) {
return (
<html lang="en">
<body>
<Navbar />
{children}...
Как передать данные из одного компонента в другой
Подскажите как передать данные из одного компонента в другой. Читал документацию но плохо понял можете показать легкий пример. На фото указал как хочу чтобы было.
Где можно найти шаблоны простеньких сайтов аля сайт визитка
Подскажите где можно найти шаблоны простеньких сайтов аля сайт визитка
Запрос axios
Здравствуйте, при запросе на сервер к базе данных, показать строку где id = userId сервер падает и выдает следующую ошибку
throw new Error(`WHERE parameter "${key}" has invalid "undefined" value`);...
Замена значений в Redux
Добрый день.
Пытаюсь сообразить, правильно или не правильно делать так:
case 'HANDLE_SET_DISPLAY_VALUE':
let newnumber = state.calculator.number;
newnumber = 5
...
Ошибка при загрузки файла net::ERR_INVALID_URL
есть картинка
<img src="data:image/png;base64,...
Формы Реакт
Есть вопрос у меня. Alert у меня считывает все кроме pass. В чем моя ошибка?
import './App.css';
function App() {
let onSubmit = (e) => {
...
Всегда проблемы с роутерами. Ни один роутер не принимает детей
И роутеры из react, и из react native. Выдаёт ошибку:
TS2559: Type '{ children: Element; }' has no properties in common with type 'IntrinsicAttributes & IntrinsicClassAttributes > & Readonly '.
...
Uncaught ReferenceError: render is not defined
Приветик всем, у меня возникла ошибка. не могу запустить начальную обычную программу, только начала изучать. ищу в интернете не могу найти или что то не понимаю. Объясните пожалуйста.
import...
Не изменяется state
Здравствуйте!
Не могу понять почему не отрабатывает this.setState() при вызове функции.
Вот код:
constructor(props){
super(props);
this.state = {
posts: ,
loading: false,
...
Форма. Добавление строки в таблицу при повторном вводе
Добрый день. По заданию нужно создать форму и все ее значения вывести в таблицу ниже. Вроде кое-что уже сделал, но выводятся только первые значения , а нужно чтоб при повторном вводе добавлялась...
Отправка в браузер React файла с сервера Node js
Возможно ли отправить большой React файл в браузер через node js?
я нашёл примеры отправки простых файлов реакт через babel
html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
...
Доступ к свойствам объекта
В музыкальном сервисе last.fm необходимо получить список популярных треков ("name"). При обращении к данному свойству я получаю ошибку "TypeError: Cannot read property 'track' of undefined". Понимаю,...
Routing react-router-dom
Здравствуйте столкнулся с проблемой при создании дочерних страниц вот так вот делаю Route
<Route path="/category" component={Category}/>
<Route path="/category/editing"...
Отслеживание изменений в форме
Доброго времени!
Есть форма, на которой 30 инпутов разного рода. Стоит задача о контоле изменений в каждом поле. Т.е. изменили возраст - подсветилась кнопка, на оснвании какого то состояния.
На...
Использование аргументов функции в setState
onAnswerClickHandler = index =>{
if(index === 0){
this.setState({
answer: {0: 'good'}
});
this.componentDidMount()
}else {
...
Работа с массивом
Добрый день, я новичок в JS, react. В компоненте Test , я получаю через GET-запрос список с элементами id,x,y. Затем это все заносится в массив elements. Проблема вот в чем, я хочу написать функцию ...
Render компонента из строки
Доброго времени суток! :)
Возможно ли средствами React или какими-то модулями выполнить render компонента, например:
из "<ComponentTest />" в <ComponentTest />. Т.е. компонент обернут в строку.
...
Как в JSON добавить теги html или svg?
Подскажие как можно в JSON файл указать html элемент или svg?
Я указал так:
{
"id": "1YQ159",
"buttons": {
"add": "<div>➕</div>",
"favorites": "<div>❤</div>"...
WordPress и React
Вообщем такой вопрос)) (если что, я пока начинающий фронтенд разработчик, не сердитесь=))
Мне нужно сделать сайт для ресторана. Писать я его буду на реакте. Нужно реализовать возможность...
роуты в реакте
Всем привет когда нажимаю на ссылку, в адресной строке постоянно добавляется "account". Если нажать один раз на ссылку "Личные данные" будет адрес - "http://localhost:3000/account/data", но если...
Динамический импорт внутри index.js
Здравствуйте! Подскажите, пожалуйста, как я могу импортировать разные файлы index.css в зависимости от условия (переданного контекста переключения языка)?
Файл index.js
import React,...
React native
Всем ку , есть проблемка уже час сижу не могу понять в чем проблема . Вообщем нужно установить react native cli на мак , все скачал , node и watchman тоже установил , крч все сделал как на сайте по...
Зависимости create-react-app
При создании react приложения командой create-react-app app внутри /app создается каталог node_modules - на 200 mb всякой всячины. Наверно, там все нужное. Но можно ли сделать, чтобы этот каталог был...
Как использоваться useCallback чтобы при вызове функции не вызывался рендер?
Есть функция let = useState('');
const changeValue = useCallback(e => {
editValue(e.currentTarget.value);
if (e.key === 'Enter') {
props.addTask(generateId(),...
Посоветуйте уроки react для начинающих
Здравствуйте.
Посоветуйте, пожалуйста уроки по react для начинающих.
К примеру создание первого приложения в visual studio code.
Что-то совсем для начинающих.
Как правильно инициализировать приложение написанное на реакте?
Всем привет.
На работе занялся рефакторингом прилодения написанного на реакте.
И столкнулся с такой ситуацией, что в проекте есть зависимости, которые как бы не встраиваются в лайфсайклы реакта....
Утечка памяти при удалении компоненты с таймером
Здравствуйте, уважаемые форумчане! Работаю над проектом в котором сейчас уже много всего, но столкнулся со сложной для меня проблемой (я недавно начал изучать ReactJS). Проблему изложил в трех...
Получение состояния элемента при клике на него
У меня есть список элементов с датам суммами и т.д. Нужно сделать так, чтобы при клике на нем можно было получить, к примеру, его id, а затем этот id передать в экшн. Как это сделать? И как сделать...
Считывание данных из локальной CSV таблицы
Здравствуйте!
Такая проблема - никак не могу понять как правильно считать данные с таблицы, чтобы было без undefined... Иначе, при переключении на страницу с этим компонентом, состояние dataCSV...
Не обновляются пути у изображений через state
Создаю сейчас "переключатель" изображений. При клике на одну из "secondary" фотографий, она меняется местами с "main" фотографией. В state элементы вроде как заменяются, но новые пути для изображений...
Страница 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 минут...
Использование круглых скобок при создании Компонентов
Привет :) . Почитал, как создавать компоненты: можно использовать функцию (обычную или стрелочную), либо класс. Для примера буду использовать обычную функцию. В одном примере видел примерно такой...
Как можно менять параметры уже размещенных компонентов?
Я хочу создать модальное окно, компонент в котором можно было бы выводить сообщения.
Например:
class Modal extends React.Component {
constructor(props) {
super(props);
}
...
Uncaught Error: createRoot(.): Target container is not a DOM element
В чем может быть проблема? id написал верные (В html разметке они такие же). До этого рендерился products без проблем, добавил reviews и появилась ошибка в браузере Uncaught Error: createRoot(.):...
Можно ли в реакте как то дополнить объект в стейте?
доброго времени суток, подскажите пожалуйста, есть стейт, в нем лежит некий объект
state = {
object: {
key: value
}
}
и есть несколько компонентов, которые должны в объект...
Как правильно обернуть React ом существующую верстку
Рассматриваю для принятие на вооружение React (на данном этапе сравниваю с vue). Использоваться будет только на отдельных страницах сайтов. (как пример: формы со сложной логикой). На одном из...
Логика в useReducer
Всем привет!
Не могу разобраться с логикой редьюсера.
Логика такая. Если хоть один свитч1...3 активный, то и generalSwitch активный, но как сделать чтобы еще и работало наоборот?
(тоесть если...
Имеет ли смысл использовать Next.js в большом проекте?
Имеет ли смысл использовать Next.js в большом проекте? И если да, то в каком случае.
Есть ли минусы его использования?
Структурирование данных для отображения
Приветствую формучане, запутался в написании правильной структуры JSON файла с данными, которые я хотел бы отобразить, а возможно он даже и не нужен, но пока не могу прикинуть как правильно...
Как реализовать на клики не авторизованным пользователям
{
state.auth ?
<Switch>
<Route path='/' exact component={Home}/>
...
Контейнерная компонента
Финальная цель - реализовать тоже самое что и на https://todoist.com в разделе "сегодня". Если кратко, добавляем задачи, добавленные задачи можно удалять и изменять(при нажатии на задачу она меняется...
Как отправить динамическую форму в axios
Добрый день!!!
Есть динамическая форма:
<h1>Add Stage</h1>
<form className={classes.root} onSubmit={handleSubmit}>
{inputFields.map((inputField, index) => (
...
Неверно сохраняется статья
Доброе время суток, пишу программу Блог (набор статей). При сохранении статьи появляется следующая информация (выделено жирным шрифтом):
<p class="text-justify" style="margin: 0px 0px 10px; color:...
Где можно взять свободные API данные для поиска отелей по названию города
Нужно сделать приложение в React по поиску отелей по названию города, не могу найти API данные, чтобы делать get запрос. Нужно вывести название отеля и картинку, а также на первой странице вводится...
Анимации в React на JQ?
Всем привет! Пишу проект на React в котором большое количество анимированных элементов. Как лучше анимировать их средствами JS? Можно ли подключить JQ в React и работать на нем?
Как один из...
Нужно ли знать фреймворк "Jest" для "Front-end developer (react)"?
Здравствуйте, нужно ли знать фреймворк "Jest" для "Front-end developer (react)"?
Насколько хорошо?
Env в create-react-app
Добрый день,
В проекте использую create-react-app. В качестве хоста для проекта использую gh-pages.
Адрес на gh-pages такой ... .io/constructor/....
в js указываю для путей...
Redux. Регистрация состояние стора, исходя из композиции компонентов
Уважаемые форумчане, помогите пожалуйста понять, как правильно реализовать задачу, которую одна компания дает на своих технических интервью.
Суть проблемы: нужно сделать программу, на подобии todo...
Значения из инпутов, добавить в конец массива.
Доброго времени суток. Помогите пожалуйста закончить задачу. Нужно значения из инпутов, добавить в конец массива.
Вот, что смог написать,
const ListCars =
const ShowItem = () => {
let...
Как сделать, чтобы текущая дата в DatePicker (material-ui) автоматически обновлялась?
То есть если страница открыта в браузере в момент смены суток.
Формы в Production режиме (react-scripts build)
Всем день добрый,
Ищу помощь коллективного разума. Есть приложение на Реакте. Все работает как положено и ожидаемо в Дев режиме; при компиляции в Production, банальная обработка форм не работает. ...
Как сделать такое выпадающее меню на React?
Подскажите как сделать такое выпадающее меню, с вложенным уровнем на React.
Что-то нечего не могу найти в интернете похожего...
Вызов родительской функции с параметрами из функции в компоненте
Доброго времени суток ув. фоурмчане
по немногу пытаюсь освоить реакт и столкнулся с вот такой проблемой.
имеется компонент App в state которого хранится token так-же в нем есть ф-я авторизации,...
Как переиспользовать компоненты в react native
Я уже и не надеюсь, но вдруг именно здесь смогут помочь.
Разрабатывая приложение столкнулся с проблемой, в процессе работы приложение обращается к серверу и получает некоторый массив, далее...
Строка в переменной не распознается require
Добрый день!
Подскажите, пожалуйста.
Передаю в функцию стили и путь к изображению.
Но возникает странная ситуация, если пытаюсь получить image2, то возникает ошибка "Error: Cannot find module...
package.json что должно быть в dependencies а что devDependencies
Добрый день.
Пишу приложение при помощи React, делал package.json руками (не через creacte app)
Закидывал всё в devDependencies
Сейчас файл имеет следующий вид:
{
"name":...
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...
Доступ к ownprops из store - react-router-redux
Здравствуйте!
Предисловие: очень большой проект написан мною на ReactJS (в пакете create-react-app), недавно было принято решение прикрутить Redux т.к. поддержка стала невыносимой. Изначально...
Как правильно сделать валидацию через react hook form?
Есть два input
<input type="number" name="first" />
<input type="number" name="second" />
Как сделать валидацию что бы во втором input число должно быть 100% больше чем в первом, с выводом...
Zoom изображений при обрезке фото
Добрый день, нужно сделать, чтобы юзер мог зумить изображение жестами с телефона во время обрезки фото
Может быть кто сталкивался и делал, либо если есть полезные ссылки, то поделитесь пожалуйста
...
React Unit Test общее представление
Добрый день.
Появилось немного свободного времени и я пытаюсь разобраться, что суть есть тестирование в React.
Сейчас читаю вот это https://ru.reactjs.org/docs/testing-recipes.html
Там приводятся...
Позиционирование кнопки по правому краю ReactJS + ChakraUI
День добрый!
Что-то никак не могу выравнять элемент по правому краю. Использую React в связке с Chakra-UI.
Можно по-идее написать функционал для вычисления нужного Margin'a, но даже как по-мне ,...
Выполнить проверку при загрузке страницы
Есть приложение. В элемента есть конечная начальная. Буру текущую дату, сравниваю с конечной и меняю фон (если, например, дата больше финальной, то красный цвет). Работает только при клике. Как...
Почему в функцию постоянно передается значения "false"?
Здравствуйте, почему в функцию постоянно передается значения "false" если должно передаваться значения "true"?
ст 47, в аргумент truths должен передаваться true, но там почему-то false.
Подскажите...
Как сделать кнопку лайк для поста React Redux Firebase?
Доброго времени суток!
Как сделать кнопку лайк для поста React Redux Firebase?
Нужно ли удалять проверку типов "PropTypes"?
Здравствуйте, вот допустим есть какой-то код и есть проверка типов "PropTypes" Всё прекрасно работает, только у меня вопрос возникает. Нужно ли удалять строчки кода которые отвечают за проверку...
Вытащить результат переменных из функции
Приветствую формучане, подскажите как мне из функции test() вытащить полученный результат переменных res4 и col, на 34 и 36 строке чтобы продолжить с ними дальше работу со 127 строки. Ведь я их...
Запуск npm run build
Здравствуйте, уважаемые форумчане! Пытаюсь запустить build на указанном домене. Раньше, когда использовал npm start делал так: HOST=domain_name npm start и сервер стартовал по указанному домену.
...
React и вывод елементов
Я беру ресурс и вывожу данные через fetch. Дело в том, что у меня выводятся сразу все элементы с моего ресурса. Есть вопрос, как сделать так чтобы элементы показывались как в интернет магазине:...
Проблемы с setState при считывании данных с сервера
Здравствуйте, только начал изучать react, пытаюсь с базы загрузить информацию себе в приложение. Вроде бы делаю всё правильно, class App extends React.Component {
constructor(props) {...
Не удается переопределить интерфейс ThemeOptions библиотеки MaterialUI
Всем привет. Есть приложение на React + Typescript + MaterialUI Пытаюсь добавить в тему MaterialUI свои поля. Почему-то не работает переопределение интерфейса ThemeOptions.
При попытке передать в...
React: Встроенные условия if с логическим оператором &&
Привет. Изучаю React. Нашёл такой пример:
Пример 1:
... в JavaScript-выражение true && expression всегда вычисляется как expression, а выражение false && expression — как false. То есть, если...
Массив объектов в конструкторе
Всем добрый вечер! Только начал работать с React, прошу вашей помощи. Есть вопросы с вариантами ответов (может быть как один правильным так и несколько). Нужно в переменной currentValues, которая...
Как применять ReactJS?
Здравствуйте изучаю React все понял но как его натянуть на сайт с таким HTML? Да и в каких случаях его использовать и как?
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN"...
Научиться работе на React
здравствуйте, не так давно решился разобраться в библиотеке или фреймворке react js и столкнулся с тем, что во всех туторилах или видио на ютубе все начинается с настройки node пакетменеджеров babel...
Ререндер родителя обёртки при изменении в дочернем компоненте
Добрый день.
Происходит ререндер родителя-обёртки при изменении в дочернем компоненте.
Хотя мне это не нужно.
<div id="root"></div>
const Page = ({ children, title }) => {
console.log("Page...
react-draft-wysiwyg на хуках
Не могу найти нормальный источник по использованию react-draft-wysiwyg на хуках. Не могу разобраться c editorState и onEditorStateChange.
Как изменить стиль JedWatson react-select
https://github.com/JedWatson/react-select
Использую этот пакет для реализации select
<div className="selectClass">
<Select
...
Webpack независимые сборки
есть структура
node_modules/
package.json
folder1/
webpack.config.js
jest.config.js
tsconfig.json
TextField теряет фокус после первого введенного символа
Добрый вечер. Практически всегда при вводе текста в TextField теряется фокус на поле после первого введенного символа. Если нажать на поле второй раз и продолжить писать - все ок. Подскажите с чем...
Асинхронность setState
this.state.error={text:'true',date:'false'}
errorFunction = (prop) => {
let arr = {...this.state.error};
arr = false;
this.setState(() => {
return {error: arr}
})
};...
React document.getElementById
Добрый день.
Подскажите, могу ли я пользоваться document.getElementById при разработки react приложения?
Кто-то говорит да, кто-то нет, не очень понятно, но у меня получалось обходится и без этого....
Изменение ссылок разработчика на корректные после сборки
Всем привет!
Разрабатываю Frontend на ReactJS и Backend(REST API) на web api asp.net.
При разработке данные от Backend запрашиваю посредством конструкции:
await...
Каким способом можно изменить дублирование id товара, если их несколько одинаковых добавилось, а удалить надо 1
const Cart = (props) => {
debugger
let elementsCart = props.cart.cart.map((c) => {
return <div>
<h3>
<li >{c.name}</li>
</h3>
...
Добавление ReactJS в проект без запуска через npm
Всем привет! Имеется готовый проект. Бэк на Yii2, фронт написан в нём же. Подскажите, пожалуйста, как добавить кусочек фронта на ReactJS в готовую страницу, так, чтобы, например, в OpenServer'е при...
Насколько распространены такие подходы ("паттерны")
Всем привет.
Встретил некоторые паттерны (конечно, таковыми их можно назвать с натяжкой).
Хочу узнать, в реальных (а не учебных приложениях) насколько они считаются хорошей практикой.
1)...
i18next.t не видит ключ
Всем привет.
Пытаюсь сделать локализованную строку с помощью i18-next.
Вызовы вида:
i18next.t("namspace.ключ"), i18next.t("namspace:ключ") и i18next.t("ключ", {ns: "namespace"}) выдают название...
React Router Lazy load Chunks
Как настроить динамическую подгрузку модулей при переходе между разделами приложения?
Вывести Object.assign объект в консоль
Есть редьюсер с начальным состоянием, и нужно вывести в консоль новое состояние, созданное с пом. Object.assign(). Как это можно сделать? С console.log? Но как именно?
export let initialState = {...
React по два раза выполняет код
Здравствуйте. Создал новое react приложение, почистил и удалил ненужное и столкнулся с проблемкой, что код выполняеться 2 раза. Если посмотреть в консоли путь к источнику второго вызова, то там...
Получение данных API и обновление Redux
Написал опросник, который при загрузке станицы сразу грузит вопрос из API, функцию загрузки вопроса запускаю в componentDidMount(), как теперь в Redux сделать тоже самое, чтобы вопрос загружался при...
Странность с использованием хука состояния
Изучаю react, изучаю сейчас хуки.
Вот такой компонент, всё работает как надо:
function MyComponentWithHooks()
{
let = useState( );
let answer = useRef(null);
let num1 = useRef(null);...
Данные SQL запросов в Реакт
Друзья, добрый день.
Подскажите, пожалуйста: приложение работает одновременно с большим количеством наборов данных (результатов SQL-запросов к БД). Есть несколько Мастер-запросов, есть их Детали,...
Не работают события мыши в IE 11
Собственно весь вопрос уже в теме, нужно использовать событие мыши в IE 11, в частности onMouseEnter и onMouseLeave. Как это сделать, в chrome всё норма
Как менять пропс по условию?
Всем привет, пожалуйста помогите с вопросом
Нужно по наведению мыши (onMouseOver) изменять пропс Paper на значение 3 и обратно, если мышь убрали (onMouseDown)
<Grid item xs={12} sm={6} md={4}>...
Touch slider
Всем привет. Пытаюсь создать touch слайдер. Не понимаю почему слайды двигаются криво
import React, {useState} from 'react';
import './slider.css'
import SliderArray from "./slides/slides";
...
Получение данных из массива
let m =
При выводе результатов на экран получаю: ВасяФедяПетя.
Как результат разбить на отдельные строки?
Наследование state
Можно ли унаследовать this.state у класса? и как это сделать. Пример
class Example extends Component {
constructor(props) {
super();
this.state = {
param1:
...
SignalR + ReactJS потеря состояния компонента
Здравствуйте. Разбираясь с реактом, решил написать небольшой чат. Он состоит из двух компонентов: RoomChat и RoomChatControls.
RoomChat содержит в себе textarea для вывода сообщений и, собственно,...
Не пойму, как отправить форму на ReactJS
Не могу никак отправить данные на почту. У меня довольно большое приложение с redux, а все туториалы на эту тему сделаны в условиях небольшого приложения с локальным state. Так вот я попытался...
Слишком много повторяющегося кода в Редаксе
Представим, что у нас приложение средней крупности, в котором из UI (Реакта) через Редакс делаем кучу асинхронных запросов на бэкэнд (изменяем данные в БД)
На основе документации Редакса для каждого...
React Native: переключение экранов
Всем привет!
Нужен Ваш совет, как лучше и правильнее реализовать переключение с загрузочного экрана, на экран, допустим, регистрации.
Т.е мне необходимо через некоторое время, допустим через 5...
Не рекомендовать некоторые объекты
Добрый день.
Есть страница с рекомендациями некоторых товаров.
Выводятся по 3 штуки. Всего их много но некоторые из них надо убрать из списка рекомендованных чтобы они не выводились.
Не подскажите...
Куда выносить логику функциональности компонентов?
Здравствуйте. Знаю что в компонентах не должно быть много логики, необходимо ее выносить в Services или в hooks. Как определить куда?
Использование constructor(props) super(props)
Компоненты в React, я знаю, можно задать двумя способами - как класс и как функцию(стрелочную или обычную). У меня компоненты заданы как стрелочные функции, т.е...
const App = (props, state) => {...
Проблема с 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"
Вот как...
Как на функциональных компонентах написать страницу фильтрации через get запрос
Как на функциональных компонентах написать страницу фильтрации через get запрос для учебного макета сайта недвижимости? Те подбираем квартиру по параметрам city, rooms, price и вешаем везде...
Можно ли передать в React - хук другой хук и там им пользоваться?
Вопрос в том, что я хочу сделать универсальный хук который будет получать данные для сущности либо по хуку GetEntity, либо получать по особенному иницилизированный объект для добавления по хуку...
Хранение фрагментов кода в json
Планирую хранить на сервере информацию в json, но значением одного из полей должен быть фрагмент js кода, который потом буду выводить текстом на страницу. Нужно сохранить форматирование, как я...
Запись значения из select в input
Привет всем!
Есть форма
<form action="#">
<div class="submit-field-location">
<select class="chosen-select" name='options'>
<option value='option-1'>Option 1</option>
<option...
Скрытие лишних блоков компонента без опционального доступа
Всем привет:)
Ситуация такая: есть готовый компонент SketchPicker из react-color. Этот компонент содержит лишние блоки, которые я бы не хотел показывать пользователю. Интерфейс компонента не...
Создать Sidebar
Нужно на реакте написать sidebar.
Кто может помочь, и что будет стоить?
UseEffect. Не сразу обновляются данные в таблице
Здравствуйте, у меня есть некоторый дроплист от значения которого должен выполнятся определенный GET-запрос к серверу. Проблема: Url меняется, но изначально данные таблицы пустые, вместе с полученным...
Не ререндерится "Display Panel" при клике на кнопке в "Control Panel", почему?
Здравствуйте, когда происходит клик по синей кнопке "Add" изменяется состояние "tasks" в файле TasksProvider.jsx, это видно в консоли, но почему то нету рендеринга в компоненте...
Получение данных из поля ввода
Как получить данные с поля ввода и вывести их например рядом с формой? Через onChange не получается, так как оно начинает сразу же печататься.
Не рендерит React страницу из-за 404 ошибки
Доброго времени суток!
Пытаюсь создать первое приложение на реакте
Мой package.json
{
"name": "budget",
"version": "1.0.0",
"scripts": {
"start": "lite-server"
В каких случаях стоит хранить значения в стейте компоненты, а в каких случаях в инстансе?
Вопрос по собеседованию React.
В каких случаях стоит хранить значения в стейте компоненты, а в каких случаях в инстансе?
Отображение видео через react-video-js-player: The media could not be loaded
Всем привет!
В плеере как правильно в коде указать путь к видео, расположенному на сервере http : / / w w w . ****** . online по адресу:
/root/media/video.mp4 ?
class WinMain extends...
Ошибки при запуске проекта
Скачал react-проект с github от блогера, который делал курсы криптовалют на стриме, у него ошибок небыло. Когда запустил я посыпались ошибки в консоле браузера. В терминале всё нормально было....
react-joyride + modal
Доброго времени суток.
Пытаюсь настроить подсказки для пользователей, суть в следующем - по кнопке в хедере считывается текущий url, в зависимости от страницы вылезают подсказки по текущему...
Делаю сайт, по видео с ютуба, нужна помощь
Здравствуйте, делаю сайт по видео с ютуба, немного изменил его под себя, делаю в целях изучения технологий.
Сделал какую-то клиентскую и серверную часть, дошло до объединения их в единое целое. Но...
Есть список книг (массив), при нажатии на конкретное значение получаешь описание той книги, на которую нажал
import React, { Component } from "react";
import "./App.css";
import booksData from "./api/booksData.json";
class WeatherDisplay extends Component {
constructor() {
super();
...
Реакт перестал импортировать файлы и компоненты
Я очень проблему в работе с React, она попадается мне очень часто.
У меня не импортируются копмоненты и файлы в React. Конечно, чтобы импортировать файл я пишу:
export let НазваниеФайла =
Но...
Не удаётся импортировать модули React.Js ES6
Есть такой вот файл конфига
{
"name": "my-app",
"version": "0.0.1",
"scripts": {
"start": "lite-server"
},
"dependencies": {
"eslint": "^4.4.1",
...
Как правильно обновлять state на основе предыдущего значения state? Какие могут при этом возникнуть проблемы?
Как правильно обновлять state на основе предыдущего значения state? Какие могут при этом возникнуть проблемы?
Обновить state на основе предыдущего значения - я разобрался.
Не пойму какие могут...
How set file name from a pdf base 64 into iframe
Когда я нажимаю на иконку Download from iframe (html), мне нужно добавить собственное имя в pdf base 64, которое я получаю из back-end (я попытался отправить заголовок с именем файла с net. Core без...
Как сделать счетчик, с прокруткой цифр по разрядам reactjs?
Всем привет.
Есть счётчик цифр с анимцией.
Первая анимация начнется через 10 секунд
Вот пример
Нужно сделать так, чтобы числа прокручивались по разрядам (возможно это называется по другому).
...
Несколько state в редьюсере перед конструкцией switch case
Творится что-то паранормальное! У меня в редьюсере несколько state, когда я вывожу в консоль, вот:
export const costsReducer = (state = initialCostsState, action) => {...
Парсинг данных
Здравствуйте! Мне необходимо сделать правильное чтение данных из txt-файла и по полученным данным построить один график для необходимого спектра(который выберет пользователь). В txt-файле несколько...
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...
Как правильно записать условие на 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...
Событие плохо срабатывает
Есть компонент:
import React from 'react';
import './todo-list-item.css';
export default class TodoListItem extends React.Component {
state = {
'done': false,
Проблемы с состоянием аутентификации MobX
Доброго времени суток, создаю spa веб-приложение, для хранения всех состояний выбрал mobx, создал корневое хранилище (RootStore), создал хранилище с фичами для авторизации (AuthStore),подключил...
Работа иконок-ссылок по нажатию
Доброе время суток!
................
const ControlPanelContainer = ({ className }) => {
const navigate = useNavigate();
return (
<div className={className}>
<RightAligned>...
Ошибка при установке 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 Native. Клик по кнопке при открытой клавиатуре
Всем привет!
Проблема такая:
При открытой клавиатуре, если нажать на кнопку Continue, то кнопка не срабатывает. Вместо этого срабатывает закрытие клавиатуры. И только потом можно уже нажимать...
Firebase
не работает авторизация через firebase,просто так перестало подключаться,кроме подключения из за того что все время пытается засетать юзера переполняется стек вызова. Получается все время приходит...
Динамически менять псевдо элемент
Здравствуйте!!!
Подскажите можно ли менять псевдо элемент например :before? Например у примера ниже у дива есть :before как можно менять именно псевдо элемент?
<div style={ { width: props.width }...
Почему не передается props?
Здравствуйте. Создаю компонент сортировки товара в зависимости от цены.
Компонент выглядит так:
<code lang="javascript">
<Routes>
<Route path="salad" element={<Salad selected={selected}...
Перевод из градусов Цельсия в кельвины
Здравствуйте, возникает ошибка в подсчёте именно в {temp+273.15}. Прибавляет не к числу, а ставит перед числом цифру. С Фаренгейтом все работает.(В React).
import React, {useState} from 'react';...
React Native. Сохранение внешнего файла json с проверкой на наличие обновлений в нём
Вечер добрый. Подскажите как сделать проверку на наличие изменения во внешнем файле? Предположим, я скачиваю файл json с сервера и сохраняю его через Async Storage. Но как сделать так, чтобы файл...
Как передать св-во дочернему элементу от родителя
eachTask(item, i) {
return (
<Task key={i} index={i}>
{item}
</Task>
);
...
Работа со свойствами в стейте
Есть два свойства в стейте, я хочу из одного свойства обратиться к другому внутри стейта.
this.state = {
dayDate: new Date().getDate(),
dayOfWeek: this.state.dayDate
}
Бьет...
Expo React Native Ad Rewarded
Помогите, пожалуйста. Не знаю что правильно нужно использовать для добавления рекламы, которая даёт награду за просмотр в expo приложение. GPT постоянно даёт противоречивые предложения. Нужен самый...
Сбрасывается состояние фильтров, сортировки и Pagination в Таблице при нажатии на чекбокс для выбора строки
Сбрасывается состояние фильтров, сортировки и Pagination в Таблице при нажатии на чекбокс для выбора строки.
При нажатии на чек бокс таблица ререндериться в дефолтном виде. С очисткой фильтров и...
Группировка элементов диаграммы Ганта с одинаковым значением поля в одной строке
У меня кое-что не получается, уже давно ломаю голову....
Пожалуйста, взгляните на картинку, которую я прикрепил ниже:
И у меня уже есть абсолютно все значения для отображения этой диаграммы,...
Подскажите что и как? ReactJS
var jsontext='';
var comments = JSON.parse(jsontext);
var sost=true;
const Comment = (props) => {
let { general, job, address, contact } = props
if(sost){
...
QR сканер для react на несколько камер
Здравствуйте. Нужно на react добавить возможность сканирования QR кода для входа в систему.
Нашла компоненты типа react-qr-reader, react-qr-scaner. react-qr-reader тут возможность выбора камеры...
Не срабатывают Routes, Route, Navigate с пакета react-router-dom
Работаю с нодой не так давно и не знаю всех тонкостей. Методом пробы и вывода понял что не выводит данные написанные в тегах Routes, Route, Navigate которые импортирую с пакета react-router-dom....
React и тернарный оператор
Я имею код который прячется при клику на кнопку Hide. Как сделать чтобы , когда header не видно, текст был "Show". Спасибо и добра вам)
import './App.css';
import {useState} from "react";
...
Проблема с функцией обработчиком onClick
Суть моего компонента: В input записывается значение в виде, далее нажимается кнопка посчитать и в результат записывается значение факториала (на данном этапе пока не выводит в результат), при...
React JSX ошибка
Начал изучать React. C чистым React пока что всё понятно. Но как попытался запустить простейщий пример на JSX
<!DOCTYPE html>
<html>
<head>
<title>Hello React</title>
<meta...
Ошибка теста с мок-компонентом Jest Enzyme
Для теста решила заменить дочерний компонент на обычную кнопку.
При mount-е компонента в тесте, по идее, настоящий компонент должен заменяться на мок-компонент. Однако, мок-компонент просто...
DevExtreme DataGrid не перерисовывается при установке состояния
Всем привет. Столкнулся со странным поведением DevExtreme React.
Вставляю простейший компонент таблицы с dataSource и columns
Колонки рисуются корректно, но значения в dataSource не подставляются -...
Роутинг внутри таб элементов
Доброго времени суток! Пишу приложение на React и возникла необходимость настроить грамотный роутинг внутри табов.
В чем суть.
Входим в систему, слева боковая панель, переходим в кладку приложения...
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) ...
reselect (глубокое сравнение)
Как селектором добраться до списка фотографий в структуре, в которой несколько альбомов (они могут добавляться/удаляться)
Я сделал динамический селектор, но он не отрисовывается при добавлении новой...
Как имитировать ошибку в "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...
App.js Не срабатывает на index.js
Вот код app.js
import logo from './logo.svg';
import './App.css';
const Header = () => {
return <h2>Hello world</h2>
}
function App() {
next.js 14 - кеш fetch - запроса обновляется, даже если не выставлять опцию revalidate
почему? каждый раз при обновлении страницы время обновляется
type Time = {
datetime: string
}
async function getTime(): Promise<Time> {
const res = await...
добавление пользователя в базу данных
пытаюсь добавить пользователя в бд
код формы:
import * as React from 'react';
import { RouteComponentProps } from 'react-router';
import { Link, NavLink } from 'react-router-dom';
import {...
React Native Калькулятор
Здравствуйте!
В Реакт Нативе я новичок от слова совсем и посему хоче кое-что спросить. Есть некоторый говнокод калькулятора del, писалось на коленке, но все же, хотелось бы перевести его в...
Повесить событие на кнопку при динамическом создании кнопки в React
При выполнении события у меня вызывается функция, в которой рисуется кнопка;
let html = '<button class="take" onClick={this.getActors}/>';
document.getElementById('log').innerHTML += html;
...
Ошибка 404 при запуске проекта на сервере
С проектом вроде все норм, в dev mods все нормально, даже на хостинге все норм, но есть необходимость запускать проект на эмуляторе webos и там уже выдает ошибку 404. Еще такая странность может так и...
Запрос Axios React js
Подскажите, как посылать данные на Axios React на кириллице? в кодировке UTF-8 и windows-1251 пробовал не работает
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...
Ошибка при запуске проекта на 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...
Некорректный resolve модуля в Vite
Всем привет.
Имеется приложение на vite+react+typescript. Заметил непонятное поведение при импортах.
Если происходит импорт модулей, имеющих в папках одного предка, то Quick Fix VsCode предлагает...
Итерация children
Здравствуйте!
Почему не выводится children из app.js (<Record>)?
Пытаюсь вывести чайлды из app.js в person-details.js, но почему-то коллекция пуста...
Вывожу так:
...
Завершается процесс после закрытия консоли
Коллеги, приветствую!
Ситуация: есть сайт и админка к нему. Живут на виртуалке в трех контейнерах. Сайт в одном, БД во втором и админка в третьем.
После перезапуска виртуалки БД и сайт подняли,...
Вывод компонент в зависимости от props
Доброго времени суток.
задумка такова - есть компонент, содержащий в себе другие, скажем такого плана:
<Period />
<Group />
...
в родительский передается прос components={}
в зависимости от...
Работа с API ?
Всем привет. Дали тестовое задание.
Пытаюсь с api разобраться, но не могу понять как отправлять post запросы серверу и можно ли вообще это сделать?
Хотя бы направьте на нужную мысль. Я обратился по...
Динамическая подгрузка скриптов
Коллеги, добрый день!
Я новичок в JS\React, и мой больше относится к разработке на Java. У меня есть задача в готовом решении, которую я не могу пока решить, но может быть она и не имеет решения....
Как предоставить любому тексту возможность быть отредактированным?
Здравствуйте, как предоставить любому тексту возможность быть отредактированным?
Это нужно как-то сделать без атрибута contentEditable.
При обычном клике на текст, он не должен выделяться и быть...
Как перейти на более старую версию react js
Нужно перейти на старую версию реакта . Как это можно реализовать?
Microsoft Edge в асинхронных функциях переходит сразу к .catch
Есть пара методов с await axios, которые некорректно работают в Microsoft Edge.
На localhost не работает авторизация.
При авторизации появляется ошибка:
"Unhandled promise rejection Error"
По...
React middleware error
тут проект с ошибкой - https://github.com/SashaMaksyutenko/payShopReact
Подскажите пожалуйста как исправить ошибку в файле, код которого ниже
import { configureStore } from "@reduxjs/toolkit";...
Как избавиться от ненужного rerender компоненты
Здравствуйте, уважаемые форумчане! Сделал панель, которая сворачивается и разворачивается слева от экрана. Но когда обновляю какое-либо состояние (например, меняю язык страницы), происходит rerender...
Ошибка Objects are not valid as a React child
import React, { useState } from 'react';
function CitySearch(props) {
const = useState('');
const = useState();
const handleChange = (event) => {
...
Вывод компонента
Только приступил к изучению REact, поэтому возможно глупая проблема.
Хочу по нажатию кнопки выводить компонент. Делаю так
Кнопка import React from 'react';
import '../App.css';
export default...
Авторизация пользователя
Привет, есть сайт с nav панелью с тремя вкладками. мне нужно простую авторизацию чтоб для одного пользователя была видна ток 1 вкладка а, для второго пользователя все вкладки. Подскажите как можно...
Спрятать пагинацию
У меня есть код, который берет данные из API вместе с пагинацией. Как сделать так чтобы всех ссылок пагинациы не было, а были видны первые 10 с кнопкой следующий?
import React, {useEffect,...
Next-connect в Next.js. Проблема 500 Internal Server Error
Делаю приложение на Реакт и товары, которые я добавил в корзину после их добавления в карту не сохраняются в базе данных.
Получаю такую ошибку - POST http://localhost:3000/api/user/saveCart
файл...
Как убрать из этого кода отображение секундных стрелок?
Всем привет,
Хочу добавить на сайт флип часы найденные в сети, но нужно убрать отображение секундных стрелок. Я пробовал вырезать блоки create seconds, но в результате у меня то полностью не...
Как отключить запоминание браузером значений, введённых в InputMask?!
Уже всё перепробовала. Код всё равно запоминается.
Как воспользоваться тегом <picture> в react
Всем привет, хочу в компоненте что бы была картинка, которая при изменении браузера (если браузер не поддерживает webp ) показывала картинку jpeg. Соответственно все оборачиваю в тег picture, но...
React как переписать классы на хуки?
Может кто-то сможет объяснить, как переписать классы через хуки? В любом случае спасибо за мнение)
import React, { Component } from "react";
import ReactDOM from "react-dom";
import...
Как подключить localStorage к todo list (react)
Здравствуйте. Делал простой todo list на реакте с использованием хуков и хотел подключить к нему localStorage, что б todo айтемы хранились в нем, и при первом рендеринге брались из него (если они...
React + websocket как поднять данные из метода сокета
Здравствуйте. Есть код на Js React. Так же используются вебсокеты. У сокетов есть метод onmessage. И нужно, что бы в это методе данные поднимались наверх в компоненте (для обновления стейта), но в...
Как получить массив из БД средствами Promise?
Сначала я получаю userId и тут все хорошо:
firebaseApp.auth()
.signInAndRetrieveDataWithEmailAndPassword(email, password)
.then(response => {
...
ReactJS: Првоерка кук
Здравствуйте форумчане. Делаю приложения используя сервер написанный на NodeJS&ExpressJS и веб клиент на ReactJS. Имеется авторизация пользователя с куками, куки формируются на сервере с помощью...
Ошибка деплоя реакт приложения gh-pages -b build
В json файле прописал домашнюю директорию, прописал predeploy, deploy. При деплое выкидает ошибку.
Хотел загрузить сайт на GitHub pages
Прошу помощи)https://ibb.co/d3CstA
Swiper React: Почему не работают стили для элементов?
Почему не работают стили для навигационных кнопок?
import { Swiper, SwiperSlide } from "swiper/react";
import { Navigation } from "swiper";
import "swiper/scss";
import...
Отправить на сервер html из render
Как отправить на сервер(через jquery ajax) хтмл из render компонента?
class Clock extends React.Component {
constructor(props) {
super(props);
this.state = {date: new Date()};
}...
Некорректно работают условные классы
С помощью условий задается класс для отображения лоадера:
render () {
return (
<>
<div className="d-block">
<div>
...
React Native - рендеринг элементов массива
Здравствуйте. Совсем недавно начал изучать React Native, да и React в целом. Как можно помимо FloatList срендерить элементы из массива?
Суть в том, что у меня есть файл с данными и мне нужно взять...
Приложение на React не работает в Internet Explorer 11
Как обеспечить работу приложения в данном браузере?
Подскажите как добавлять атрибуты к html элементам в react
Прочесал интернет но не нашел нормального ответа на мой вопрос. В js был setAttribute а в React ?
В приложении React Native выдает ошибку "Cannot use 'in' operator to search for 'requestFullscreen' in null"
Добрый день!
Я пишу андроид-приложение на React Native, и там у меня на одной из страниц есть видео. Идея такова, что я с главной страницы перехожу на следующую и включаю видео. Так переход на...
Валидация форм, Formik, как сообщение с ошибкой отобразить в инпуте? как подсветить рамку инпута REACT
<p className={s.sizeBig}>
<label htmlFor={`street`}>Улица *</label><br />
<input
className={cn(s.input)}
type={`text`}
...
Синхронный скролл
Доброго времени суток! Подскажите как решить задачу.
На странице через map формируются к примеру 4 блок, у каждого из них есть свой горизонтальный скролл.
Как сделать так что бы когда скролишь один...
Пишу первый раз на реакте, в чем проблема?
<!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е бага что компонент отрабатывает но не отображает изменения?
т.е. в компонент - стрелочаня функция, получает обновленное состояние (useState) вижу что отрабатывает но никак...
Как загрузить на сервер js файл в нём используется react чтобы он работал?
есть готовая папка и я её загрузил на хостинг но код не работает он не понимает import что делать?
Мне в итоге нужно перенести с локального сервера на хостинг
Проблема с 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...
Ошибка then(.)
Доброе время суток!
.....................
const imageRef = useRef(null);
const titleRef = useRef(null);
const contentRef = useRef(null);
const dispatch = useDispatch();
const navigate =...
Как включить ввод секунд у datepicker?
Можно ли как-то включить ввод секунд в форме датапикера? Я вижу ток часы и минуты. При попытке указать формат dateFormat="MMMM d, yyyy HH:mm:ss" в инпут появляются секунды, но они обнуляются, когда...
Отображение номера текущей страницы pdf документа
Листается pdf-документ. У каждой страницы есть индекс. Как сделать, чтобы под pdf-ом всегда отображался номер текущей страницы?? Спасибо!
Почему не прокидываются пропсы в компоненту?
При рендере компоненты должны приходить пропсы, но компонента рендерится без них, а в стейте они в итоге есть.
import React from "react";
import Machine from './machine'
import {compose} from...
fetch возвращает разметку текущей HTML страницы вместо ошибки что файл не найден
Всем огромный привет!
Вопрос:
Почему fetch возвращает HTML разметку страницы вместо того, чтобы отловить ошибку, запрашиваемый файл не найден?
Контекст:
Создаю запрос на загрузку данных...
Почему у меня не применяются стили
Здравствуйте, у меня проблема в том, что когда я перехожу на url через главный путь, то все стили применяются корректно, но если я перезагружаю страницу на которую перешел из главного пути, то у меня...
Запустить проект react готовый шаблон
Всем привет. Помогите новичку. Осваиваю React, скачал шаблон админки основанной на react с библиотеками, закинул в папку на локальном сервере и через команду в консоли пытаюсь запустить проект, но...
Проблема с импортом кастомной библиотеки CKEditor
Здравствуйте.
У меня есть проблема с импортом кастомной библиотеки для редактирования и создания статей, новостей CKEditor.
По их инструкции я выбрал нужные мне плагины, скачал и залил папку...
Redux-saga вызов при срабатывании экшена
У меня есть такая сага
import API from "./../Api/Api";
export function* outPutDataSaga() {
yield put(outputFromLocalStorage(yield call(API.getAllTasks)));
}
export function* watchSaga() {...
React-router-dom
Доброго времени суток, у меня есть <Route /> который отрабатывает по пути "path="/product"". Мне надо что бы Route отрабатывал по части пути, тоесть <Route path="/{любое выражение}-product" /> и...
Код реализации компонента Money
код реализации компоента Money
Пример использования:
<Money value={5000.99} currency='USD' />
* Параметр: value - число, может быть дробным
* Параметр: currency - тип валюты, "RUB", "EUR",...
Почему не работает путь к изображению в React приложении?
Как указать относительный путь к изоражению в react приложении?
Архитектура такая
Мне сказали что нужно указывать относительный путь
import image from "./img/sweater-1.webp"
import React...
Изменение числа в калькуляторе после нажатия на кнопку "="
import React from "react"
import buttonBox from "./buttons"
import "./App.css"
class App extends React.Component {
constructor() {
super()
this.state = { //это реакт
out:...
Как отправить переменную из компонента App.js в компонент index.js где хранится стейт?
у меня создан useState переменная, которая хранит водимое значение из инпута, можно отправить эту переменную number из компонента App.js в компонент index.js где хранится Стейт чтоб можно было к нему...
Ошибка: '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 =...
Не получается передать пропсы между компонентами
в AllProduct компоненте есть компоненты Header и CartOverlay.Функции передаю непосредственно к этим компонентам с помощью пропсов.Вопрос в том что есть еще один компонент Technology в котором...
Не работает клонированный репозиторий
Клонирую раннее созданный React проект из github. Прописываю npm install, устанавливается папка node modules, запускаю проект локально npm start проект запускается появляется верстка. При изменении...
Отобразить компонент
Вкатываюсь в 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...
Добавить строку в таблицу по клавише tab
Всем привет
не соображу как добавить в таблицу новую строку по клавише "tab"
Таблица сделана на reactjs, я просто создал массив в котором прописал нужные строки.
имеет вид:
1. строка 1
2....
Добавление React в локальный сайт
Добрый день.
Хочу попробовать встроить React в существующий сайт - дабы изучить что-то новое, т.к. в офисе начинают разработку на React, но никого еще нет. Сайт в локальной сети на PHP, Javascript и...
Не видит файл с кодом
Хочу сослаться на файл с кодом, смотрел в уроках оно уже при вводе должно отображаться для выбора на какой файл сослаться, у меня почему-то такого нет, хотя файлы в одной папке и всё сохранено. Хочу...
Почему не работает Портал?
Здравствуйте, подскажите пожалуйста что не так делаю.
Error: Target container is not a DOM element.
GitHub:...
Кастомизация react-bootstrap
Начал использовать react-bootstrap и хочу узнать могу ли я как-то изменить стили у стрелок навигации карусели, хочется их вынести за за карусель и изменить цвета , то есть левую стрелочку хочу...
Автоскролл до конца при загрузке динамических картинок
Добрый день. Реализовал алгоритм автоматического скролла вниз до высоты окна. Но когда загружается динамическое изображение первый раз - окно не хочет скролить его до конца. При повторной загрузке -...
Не выводятся данные из store
http://************/r5cs8cЗдравствуйте!
Может кто сталкивался, подскажите плз.
В общем в приложении использую redux. В store хранится два массива - filters и coktails.
const initialState = {...
Не появляется имя пользователя
Доброе время суток!
В моем проекте, захожу под определенным пользователем, пишу комментарий к статье и нажимаю кн. Добавить. Всё добавляется кроме имени пользователя, при перезагрузке страницы...
Как итеративно рендерить дерево компонентов? как я понял рекурсия более затратна по производительности?
Как итеративно рендерить вложенные компоненты? как я понял рекурсия более затратна по производительности?
Уровней вложенности может быть неограниченное количество.
Проблема в том, что при...
Ошибка Illegal characters in path при выполнении команды build
Здравствуйте друзья. Помогите пожалуйста с проблемой. Не можем решить. При попутке создать заливочный файл выдаёт такую ошибку, хотя через макбук всё нормально заливается. Но через винду не...
Подсоединить проект React к Visual NET
Всем привет
https://www.c-sharpcorner.com/article/crud-operations-in-reactjs-with-axios-using-web-api-and-sql-server/
Вопрос в том, КАК
соединить папку с проектом React к NET проекту.
В...
Не могу выложить проект на github pages
Добрый день. Выкладываю проект на gh-pages, но при попытки посещения этой страницы показывается только сообщение Unexpected Application Error! 404 Not Found
{
"name": "typing-training-app",
...
ERROR: JAVA_HOME is set to an invalid directory: /usr/lib/jvm/java-1.17.0-openjdk-amd64
какую директорию не сую в JAVA_HOME, всё неправильно для проекта на react native. подскажите что сделать чтоб данная ошибка пропала?
Как иницилизировать метки?
Здравствуйте, подскажите, как иницилизировать все метки, которые получаю с api?
Http.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var bikePoints =...
Не знаю как применить componentDidMount
Пытаюсь применить componentDidMount() в классовой компоненте, но не могу понять в каком месте. У меня есть страница со списком сотрудников, при клике на сотрудника появляется справа подробный...
Проблема с асинхронностью useState React
Всем привет. Пишу программу погодную на реакте и столкнулся бедой с хуком useState. а именно то что он асинхронен и дату которую я должен получить в state получается на первый клик сабмита null а на...
Какой Datagrid в React лучше использовать
Добрый день, использую datagrid из material-ui, но его сейчас не используют и он не совместим с react. Каким компонентом его можно заменить и чтоб он нормально работал с react?
select изменить стрелку когда меню открыто
Добрый день.
Чего-то совсем не могу нагулить.
У select есть стрелка по умолчанию (с права)
1. её надо изменить на любую svg
2. когда меню открывается её нужно изменить на другой svg
...
Проблема с подключением Chakra UI в Next.js (Pages)
хочу установить Chakra UI но сыпятся куча ошибок, после написания в файле _app.jsx ChakraProvider.
Опишу просто каждое свое действие:
1. Устанавливаю next
npm install next@latest react@latest...
Не получается изменить размер миниатюр в пакете react-grid-gallery
Не получается изменить размер миниатюр в пакете react-grid-gallery
https://github.com/benhowell/react-grid-gallery#programmers-notes
Всё равно размер получается больше указанных размеров(сама...
Последовательные (и зависимые) API вызовы - Реакт Редакс
Всем привет.
Мое приложение делает 2 запроса к разным API.
Представим, что:
1) первый запрос получает данные о юзере через экшен креатор callFirstAPI()
2) второй запрос получает посты этого...
Переход по страницам
Здравствуйте! Впервые пишу проект на реакте.
Помогите, пожалуйста, сделать переходы между страницами в хедере.
Вот сам хедер:
Хочу сделать переход на страницу контакты и на главную.
Вот...
Как сделать поворот страниц pdf документа в React?
поступило такое задание
Как удалить товар?
https://codesandbox.io/s/loving-http-ir83z9?file=/src/ProductList.js не работает удаление товара(попробуйте создать товар и потом удалить)
Проблема с выводом массива через карточку
Здравствуйте, у меня возникла проблема с выводом массива через индексацию. Суть проблемы в том, что при использовании mavies.map карточки выводятся в виде одной колонки, а в этом методе страница...
Форма реакт, вывод цены от и до
Изучаю реакт, возникла проблема с формой поиска, в полях "Price" дублируются значения.
Что в этом случае лучше сделать? Присвоить key элементам (чтобы от и до в цене показывалось) или лучше как-то...
Каким образом можно обойти первый рендер от хука useEffect?
Доброго времени суток. Часа 3 пытаюсь решить одну проблему, на самом деле максимально примитивная.
В общем, не вдаваясь в подробности. К примеру есть состояние и функция, которая меняет это...
React.lazy и имена файлов
Добавил в проект React.lazy. Бандл теперь дробиться все ок. Но есть вопросы:
1. Имена файлов генерируются примерно так 876.script.js - эта цифровая приставка - она надежно закреплятся за скриптом...
Как организовать mobx store?
Есть код, где в store в state хранится folder_id, employeesList и currentEmploySelect. То есть текущая папка, список сотрудников и текущий выбранный сотрудник.
Store 1 на всё приложение.
Сейчас...
Как сделать такой же запрос на другой странице через input?
const FirstPage = (props) => {
let newText = React.createRef();
const getHotels = () => {
...
Ищу хорошую практику по работе с формами для сайта с большим количеством форм
Есть задача написать сайт с большим количеством форм ввода данных. Около 30 интерфейсов будет (по 10-30 элементов в каждой форме). Сайт внутренний для корпорации. И эти формы постоянно обновляются и...
Надо установить react-konva, но выдает ошибку: 96 vulnerabilities (85 moderate, 11 high).
Сап! Тут такая проблема мне надо установить react-konva, но выдает ошибку. Как я понял связано это с конфликтом между библиотеками, хотя хз.
Я создал React через npx create-react-app my-app
1) На 1...
Получение данных из API
Не получается получить данные с API. Для аутентификации на сервере необходимо добавить к запросу заголовок «TMG-Api-Key» со значением API_KEY, скорее всего я что-то не так добавляю.
Функция с...
Изменение цвета звёздочки required по нажатию InputLabel в material-UI React
const useStyles: StylesHook<any> = makeStyles({
paper: {
height: '280px',
width: '600px',
},
closeButton: {
position: 'absolute',
top: '8px',
...
React JS фото из папки
Как в react js вывести все фото из папки?
Как исправить 401 (Unauthorized)?
Здравствуйте, сделал jwt авторизацию и регистрацию. Но при проверки авторизированный ли пользователь выдаёт 401 Unauthorized отправлял через axios запрос на получение refresh токена(react/redux)
Вот...
Как сгенерировать файл .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'.
Ошибка при использовании useEffect
Добрый день
Возникла проблема, которую удалось отследить только до данного хука.
У меня есть 2 компонента:
1. Accordion
const Accordion = ({
/* ... */
Не удаляются инвойсы из DOM и db.json
Есть прога которая рендерит инвойсы с json файла , их можно удалять при помощи кнопки Remove напротив каждого инвойса в разметке.
Проблема в том что при нажатии на кнопку Remove компонента...
Как сделать правильную постраничную пагинацию?
Всем доброго времени суток.
Есть сайт, на нём много страниц с карточками
На каждой странице есть вот такая пагинация (см скрин 1)
Есть вот такие входные данные:
const countPage = 17 // общее...
Динамическое содержание в компоненте
Здравтсвуйте!
Стоит следующая задача:
На сервере:
В определенный момент запускается сборщик некоторой части сайта - на выходе 3 файла: module.html, module.css, module.js
Эти три файла...
Хуки в нерендерных компонентах
Здравствуйте.
Подскажите, пожалуйста, вот есть функциональный компонент сокет. Т.е. рендериться он не будет.
1. useState при изменении триггерит рендеринг- а здесь не будет ничего лишнего, что...
React как правильно вывести массив в refs.value?
Есть следующая функция, которая работает при нажатии кнопки. Должна сравнивать index приходящего массива и находить его в массиве works, не могу понять как записать works или list в value. Сейчас код...
Добавить ссылку в текст слайдера
Доброе времени суток. Помогите советом пожалуйста. Имеется слайдер....
Не могу загрузить фото
Хз, че за тема, но я не могу загрузить фото. Делаю я это таким образом:
import Lingua_desktop_1 from './src/images/Lingua_desktop_1.png'
<img src={Lingua_desktop_1}
width="300"
...
Render()
Собственно, вопрос. Почему рендер у классовой компоненты срабатывает 1 раз
class MyPosts extends React.Component {
constructor(props) {
super(props);
this.postElements =...
Проблема со спиннером и onLoad
Всем привет,
Не могу разобраться с onLoad. Дано - галерея изображений, urls хранятся в S3 и DataStore (aws amplify). На странице делается запрос в датастор, фото грузятся, каждая фото имеет onLoad...
Добавление компоненты в StoryBook
Доброго времени суток, есть такой вопрос, есть управляемая компонента, пропсами передаётся size с union типом 'small' | 'medium' | 'large', в StoryBook он подсказывает что это InputType, но при...
Как правильно использовать иконки в React через иконочный шрифт, или просто как svg картинки?
У меня есть на проекте 20+ иконок, как лучше добавлять их, через иконочный шрифт icomoon или через svg?
И если через иконочный шрифт, нормально ли использовать это...
Автоматическое перенаправление после запуска npm start с http на https
Здравствуйте, уважаемые форумчане! Столкнулся с проблемой перенаправления с http на https после запуска проекта на настоящем (не локальном) сервере. Хостинг, к сожалению, не может помочь. Настройки...
Ничего не понимаю, установка React и node js
Установил React с последней версией node js
Создалась папка /root/react-intro
Как я понимаю это веб приложение, какие необходимо произвести манипуляции для того, чтобы ее переместить где...
Получение большого количества данных и поиск
Разрабатываю API и SPA. Возникла проблема поиска данных на клиенте.
При обычном подходе клиент получает сразу данные для вывода и поиска от API. Но так как в моем случае данных очень много (от...
socket.io Дублирование сообщений в чате ReactJS App
Когда я отправляю сообщение, на первом клиенте(отправителе) все в порядке, сообщение не дублируется. Но у остальных пользователей комнаты (получателей) сообщение дублируется. В то же время, если...
Импорт нескольких файлов, содержащих состояние
Здравствуйте, уважаемые форумчане! Столкнулся со следующим вопросом. Допустим, у меня есть компонента и объекты, содержащие ее свойства вместе с состояниями в виде:
const left_right_shift = {
...
Разработать просто приложение, которое произведёт расчёт площади окружности
Здравствуйте. Мне дали задание "Разработать просто приложение, которое произведёт расчёт площади окружности". На основе React.js. Никак не могу сделать, помогите, пожалуйста <3
Изменить значение объекта в массиве
Добрый вечер. Есть массив со значениями. Вопрос в том как поменять значение по индексу. Условно нужно изменить title: "new task" для элемента с id = 2.
const = useState();
Пробовал как-то так,...
React Server-side рэндеринг
Хочусделать приложение с рэндерингом на сервере. Пытаюсь сбилдить:
const path = require("path");
const express = require("express");
const app = express();
const port = 3000;
const...
dispatch из useReducer() не вызывает ре-рендеринг
Почему dispatch из useReducer() не вызывает ре-рендеринг компонента?
export const WeatherForecast = (props) => {
const = useReducer(reducer, s)
useLayoutEffect(() => {
...
Ошбика или нет ? React Native
кто нибудь объясните почему эта ошибка выскакивает ? что с ней не так ? и как ее исправить ?
Передача данных в компонент через Link
Всем привет!
Написал такой код, но не получается извлечь переданные данные
Смотрите строку с Link, там отправка данных компоненту реализована
import React from 'react';
import { Link } from...
React + Electron, content security policy блокирует fetch запросы к сторонним api
Добрый день!
Помогите пожалуйста исправить проблему с Content security policy.
Проблема заключается в следующем:
При помощи Electron Forge внедрил свое ReactJS приложение в ElectronJS, но...
Webpack + React + использование различных версий одного компонента
Добрый вечер.
Подскажите по следующему вопросу:
Есть backend написанный на python/django.
Есть frontend написанный на java script/react.
Webpack собирает один bandle.
Backend и frontend написаны...
Как промотать вниз react-scrollbar
https://www.npmjs.com/package/react-scrollbar
Это код из родительского компонента
let chatMessages = '';
if (this.props.messages.length > 0) {
let messsages =...
Обновляется ли весь компонент, если изменения произошли в дочернем компоненте?
Обновляется ли весь компонент если изменения произошли в дочернем компоненте?
План обучения ReactJS для новичка
Приветствую.
Сейчас активно изучаю js и в дальнейшем планирую изучение реакта. Хотел задать опытным несколько вопросов, чтобы правильно организовать учебный процесс.
1) Какие разделы ванильного js...
Как обновить компонент из другого компонента?
На странице есть хедер, контентная часть и футер - это всё компоненты. В хедере находится input type="text" и кнопка. Контентная часть выводит данные с сервера, используя axios. Сам скрипт запроса...
Next.js роутинг
Добрый день! Не могу разобраться с роутингом в next.js. Всё что мне нужно, так это перенаправление с photo-session-booking.tsx на portfolio.tsx, но как бы я не пытался это сделать, ничего не вышло
Добавления состояний в Redux
const defaultState = {
isBasketShow: false
}
const reduser = (state = defaultState, action) =>{
switch (action.type) {
case "OC":
return {...state, isBasketShow:...
Обмен данными между компонентами, используя Redux
Добрый день.
Мне нужно с помощью Redux объяснить одному компоненту, что произошёл клик мышкой в другом.
В глобальном компоненте App я создал store:
const store = createStore(reducer);
...
Выдает ошибку 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
Есть много вопросов. Начну по порядку. По определению. Есть DOM-дерево, при срабатывании setState, у нас создаётся virtualDom предыдущего состояния дерева и VD нового дерева, затем ищутся изменения...
Не видит установленный пакет
Сама ошибка:
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...
Во всех строчках где есть 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}) =>...
Как сделать реагирующие точки на рисунке?
Всем привет! Есть задача и я не знаю как к ней подступиться и с чего начать.
Обычную реализацию я сделал. Суть в чем: у нас есть таблица, и по нажатию на ячейку в стейт записывается данные в этой...
Как получить и воспроизвести следующий трек?
Это код аудиоплеера на реакте, пытаюсь сделать переход на следующий трек по нажатию на соответствующую кнопку, но выдаёт различные ошибки, как правильно в данном коде воспроизвести следующий трек по...
Регулярные выражения
Добрый день! Возникла проблема с input number и регулярным выражением. У меня инпут числовой, но в него проходят символы плюс и минус. Как от этого добра избавиться? при выводе в консоли значения -...
Индикатор при загрузке
Здравствуйте!
На многих сайтах при загрузке контента в самом веху фиксированная полоска загрузки. Подскажите, если разные модули будут влиять на эту полоску, то как это все дело организовать в...
Не могу понять в чем проблема, последняя строчка container выдает ошибкой
import React from 'react';
import {StyleSheet,Text, View } from 'react-native';
import Constants from './src/NavBar';
export default function App() {
return (
<View...
Не сохраняются данные в массив
import { StatusBar } from "expo-status-bar";
import { useEffect, useRef, useState } from "react";
import {
StyleSheet,
Text,
SafeAreaView,
Image,
Button,
TextInput,
} from...
Новые блоги и статьи
|
|||
|
Запрет пометки на удаление и отмены проведения
Maks 16.07.2026
Алгоритм из решения ниже реализован на нетиповом документе "ПутевойЛист" разработанного в КА2.
Задача: запретить помечать на удаление и отменять проведения путевого листа при условии, если он сдан. . .
|
Как надо было делать правильно - вообще не слушать ИИ, его дело - текст.
Hrethgir 15.07.2026
А вообще надо было делать не так, чтобы не исправлять ошибку https:/ / www. cyberforum. ru/ blogs/ 223907/ 10996. html , правильно было : удалил кнопку, а потом добавил её.
Всё это стресс конечно. Почему?. . .
|
Знаете, от чего появляется стресс?
kumehtar 15.07.2026
Стресс появляется оттого, что вы, зная как поступить правильно, делаете наоборот.
Ларри Уингет
|
Нас бьют, а мы крепчаем? Какая чушь!
kumehtar 15.07.2026
Вот это вот бытующее мнение, что человек меняется только под действием проблем, всегда считал вредоносным. Поверь, от проблем у людей появляются не изменения, а нервное расстройство и ПТСР. А. . .
|
|
сукцессия 29. Переход от одних деревьев на другие делать более или менее вероятностным?
anaschu 12.07.2026
Насколько смена типов микоризы — исключительное событие в двухвековой сукцессии? Оценка вероятности в пространстве параметров
В текущей версии модели успешно реализован ключевой механизм. . .
|
сукцессия 27. Думаю, как переделывать уже написанную статью с планами на сукцессию.
anaschu 12.07.2026
Анализ соответствия модели требованиям
Реализованные компоненты:
Механизм закисления почвы через протонную помпу
Конкуренция между типами микориз
pH как триггер сукцессии
C/ P соотношение. . .
|
Сукцессия 26. Мат модель создана.
anaschu 12.07.2026
Модель смены растительных сукцессий посредством управления грибами работает внутри небольшой ячейки почвы, восстанавливающейся после пожара, где ненадолго бывшее царство хвойных снова захватили. . .
|
Решил проблему с ошибкой пагинации сообщений с сервера на алгоритме обхода дерева "Эстафета хвоста".
Hrethgir 12.07.2026
Проблема была в том, что удалялась именно новая кнопка, а не старая. Ни один ИИ не обнаружил это, а сам я смог только когда с работой стало попроще и когда заставил работать будущее автономное. . .
|