Вопросы с меткой [jsx]
Руководство по использованию метки jsx отсутствует.
167
вопросов
0
голосов
0
ответов
29
показов
Как лишний раз не рендерить интерфейс в react
Начал изучать react и дошел до получения данных из дб, и столкнулся с не понятием как правильно это реализовать, я захотел сделать hooks который бы принимал ссылку обрабатывал и отдавал ответ, в ...
0
голосов
0
ответов
26
показов
Быстрое создание div с классом
Начала учить react, столкнулась с тем что в JSX не могу быстро создавать классы для кнопок и дивов как в обычном css и html при верстке, т.е. например div.className + tab не работает - только ...
0
голосов
2
ответа
34
показа
Почему не конкатенируются строки в тернарном выражении?
Не получается конкатенировать строки в тернарном выражении.
Если active true, то он просто занимает всё строку и не добавляет "list_item"
Хотя при проверке это всё строки, не понимаю почему ...
0
голосов
2
ответа
35
показов
Как изменить отступ от края input для вводимого текста?
Текст расположен слишком близко к краю input, как можно его отдалить от него вправо?
JSX:
<form>
<label htmlFor="email"></label>
<input type="...
1
голос
0
ответов
40
показов
Проблема с анимацией печати текста для первой надписи
Всем привет, я сделал анимацию печати слоганов и чередование их, но заметил проблему, что как только страница загрузилась или перезагрузилась, первый слоган не печатается, а просто появляется, далее ...
0
голосов
1
ответ
46
показов
Передача картинок в компонент через пропсы в React.js
Я только-только начинаю изучать React.js и его подходы как таковые, поэтому если кто-то посчитает вопрос глупым и прочее - не судите строго. Я верстаю сайт, где на главной странице у меня отображается ...
0
голосов
0
ответов
17
показов
Какой подход выбрать в css?
У меня есть в jsx-файле элементы, которые мне необходимо стилизовать в css. Вопрос: мне нужно сразу в css объявить эти элементы, задать им размеры и позиции на своем мониторе и только потом приступать ...
0
голосов
0
ответов
66
показов
Как адаптировать в CSS так же?
На странице регистрации Facebook https://ru-ru.facebook.com/ я заметил, что под кнопками и полями ввода имеется белый квадрат. Когда я изменяю разрешение экрана через DevTools, этот квадрат и все ...
0
голосов
0
ответов
21
показ
React, в чем разница <div> и <>?
Можете объяснить, в чем разница в React двух записей?
return (
<div>
<h1>Hello</h1>
<div/>
);
return (
<>
<h1>Hello</h1>
</&...
0
голосов
1
ответ
32
показа
Как указать правильный путь к файлу
Как правильно указать путь в App.js (реакт) к файлу, который находится по пути D:\Test\frontend\chat-app\src\components\Chat\jsx\ChatLogic.jsx,
если в терминале я нахожусь в директории D:\Test\...
0
голосов
1
ответ
227
показов
Не работает Tailwind в REACT
Создал реакт приложение, подключил tailwind по инструкции https://tailwindcss.ru/docs/installation/ , пишу стили в className, но никаких изменений на странице нет. Перепробовал все что пишут в ...
0
голосов
0
ответов
34
показа
Скопировать svg с анимацией с сайта
Пытаюсь скопировать svg с анимацией с сайта nextjs.org:
но ничего не выходит:
Пробовал стырить целиком сайт, но там jsx сбилженный и тоже не могу разобраться как это в нормальный jsx законвертить, ...
0
голосов
0
ответов
24
показа
Как получать значения только отображаемых input?
Столкнулась с такой проблемой: У меня есть форма, которая содержит вложенный список (тип товаров), который в свою очередь инициирует появление блока параметров. Для каждого типа товара определенные ...
0
голосов
0
ответов
40
показов
Использование спецсимволов html в jsx
Заполняю графу погоды в приложении. Данные приходят с api, соответственно, пишу конструкцию на случай, если данные не придут. Проблема в том, что значок градуса поставлен спецсимволом, а нужно, чтобы ...
0
голосов
0
ответов
10
показов
Есть ли плагин на подобии emmet, но для .jsx файлов в vscode
Есть ли в vscode плагин который бы ускорял написание html разметки в jsx файлах, как это реализовано в emmet, то есть ставишь точку и автоматически предлагает вставить div, но чтобы это работа в ...
0
голосов
0
ответов
18
показов
Prettier - React Native
Prettier автоматически вставляет {' '} в мой JSX код, что вызывает проблему в моём EXPO компиляторе, которая говорит что string значения могут находиться только внутри тега , что нужно добавить в ...
0
голосов
1
ответ
33
показа
При обращении к полю получаю undefined
Использую реакт и редакс.
Есть 2 файла: bookContainer и bookReducer.
Содержимое bookContainer
import React from 'react'
import { borrow_book } from '../redux_library/bookActions'
import { connect } ...
0
голосов
0
ответов
13
показов
не знаю как правильно прописать function* getAllPostsWorker
застряла на таком моменте не знаю как правильно прописать в saga функцию worker, чтобы получить посты
const API = create({
baseURL: "https://api.spaceflightnewsapi.net",
});
const ...
0
голосов
0
ответов
35
показов
Не могу загрузить картинки через Webpack 5 после перехода с 4 Подскажите
сам конфиг и зависимости
ошибка просто 404, подключаю картинки в jsx через src раньше все работало
src="../../../../../img/logo_white.webp"
"@babel/cli": "^7.7.5",
...
0
голосов
0
ответов
51
показ
целесообразность useReducer в компоненте
Решил поковырять useReducer, хотелось бы узнать, имеет ли место в моём компоненте хук useReducer, или же можно было обойтись обычным стейтом? Также, так как проект на TS, прошу указать на ошибки, ...
0
голосов
1
ответ
29
показов
jsx файл не видит разметку
При сборке проекта возникла проблема, не дает в файле jsx разметку сделать. Не знаю, как решить, гуглила, но без особого результата.
Пробовала отключать eslint, думала, в нем проблема, но не помогло. ...
0
голосов
1
ответ
42
показа
Не могу передать значение из дочернего компонента в родительский
Сейчас я пытаюсь добиться следующего поведения: при выборе определенного человека, что бы он добавлялся в состояние selectedMentor. Сейчас selectedMentor хранит null.
Часть кода родительского ...
0
голосов
1
ответ
30
показов
Как сделать открывающуюся менюшку по заданному шаблону?
Делаю пэт-проект и столкнулся с проблемой на фронтэнде. Решил сделать текстовый редактор, в котором контент разбивается на блоки (заголовки, параграфы и т.д.), у каждого блока рядом есть кнопка, по ...
0
голосов
1
ответ
37
показов
Как сделать компонент, который может включать дочерние tsx (SOLID framework)
Сама ошибка:
У типа "{ children: (string | Element)[]; }" нет общих свойств с типом "IntrinsicAttributes".
Сам код .tsx :
import { type } from 'os'
import type { Component } from ...
0
голосов
0
ответов
16
показов
React.js Приложение падает при переходе на другие страницы [дубликат]
При переходе на другие страницы, приложение падает, а в консоль выдается это:
Код:
const search = async (inputs, radio, location) => {
const requestOptions = {
...
1
голос
1
ответ
136
показов
Как реализовать табы в Реакте, не используя хуки
Создал табы на чистом CSS:
https://codepen.io/syberian/pen/RwBBqGq -
и эти табы отлично работают в песочнице.
HTML
<div class='match-outcome'>
<ul class='tabs'>
<li class='tab'&...
0
голосов
0
ответов
45
показов
Почему роуты не работают?
Написал роуты вручную по видео и все работает, хочу теперь сделать их через функцию map, но не получается. В видео используется react-router 5. Я использую react-router 6. В браузере ошибка
No routes ...
0
голосов
0
ответов
178
показов
Как подружить prettier и eslint при использовании табов, и пробелов для выравнивания
В строке 27 преттиер ставит два таба для выравнивания
Кусок кода из компонента Реакт jsx:
Нужно сделать так, чтобы eslint не ругался и не подсвечивал.
Текст ошибки: - Line 27:2: Mixed spaces and ...
0
голосов
0
ответов
52
показа
что включается при автозаполнении и как избавится от этого
пытаюсь разобратся что срабатывает при автозаполнении и как это убрать, не получается, появляется какая то серая полоска и выдиление.
после нажатия enter появляется еще одна полоска возле закрывающей ...
1
голос
1
ответ
90
показов
Не отрабатывает первый рендер
Есть страница с пиццами и панель с сортировками пицц
Центральная сортировка пока не нужна, только левая и правая. Сортировки работают отлично, но есть одно но. Вторая сортировка (популярность, цена...)...
0
голосов
0
ответов
21
показ
Рендер совокупности стейтов
Первый раз делаю мини-проект на реакте - сайт с пиццей, столкнулся с такой проблемой:
У меня есть несколько видов сортировок, на каждую сортировку свой стейт. Чтобы отрендерить на странице карточки с ...
0
голосов
0
ответов
105
показов
Сохранить состояние табов в React
Помогите пожалуйста сохранить состояние табов, нужно чтобы при переключении сохранялись действия пользователя, я пока не придумал как это сделать
import React, { useState } from 'react';
import ...
0
голосов
0
ответов
55
показов
Как реализовать корзину, покупок?
Голову уже раз 5 сломал, как реализовать корзину в подобном коде?
App.js:
import logo from './logo.svg';
import './App.css';
import { Container } from '@mui/material';
import { Routes, Route } from '...
0
голосов
2
ответа
136
показов
Как избавиться от дублирования компонента в React
Недавно начал изучать React, появился вопрос про повторяемые компоненты на странице, у которых отличаются только пропсы. Есть файл App.js, в нём блок menu, куда я пихаю компоненты:
<div ...
0
голосов
0
ответов
36
показов
При запросе Key ID в React выдает Undefined
При добавлении товара не отображается его ID в консоли
App.js
if (cartItems.find((item) => Number(item.id) === Number(obj.id))) {
axios.delete(`/cart/${obj.id}`);
setCartItems((prev)...
0
голосов
1
ответ
400
показов
react: преобразовать текст в html код
подскажите, как можно преобразовать текст внутри которого также указываются html теги в html код
если более точно, то у меня есть строка, которая содержит html код:
this.state = {
text: 'test <...
0
голосов
1
ответ
205
показов
Модальное окно обрезается сверху при уменьшении высоты экрана (React Js)
Есть модальное окно на react js.
При уменьшении высоты экрана, обрезается верхняя часть модального окна, при этом скролл работает вниз и показывает часть которая не влезла, но верхнюю часть ...
0
голосов
1
ответ
243
показа
Записать React компонент в переменную и использовать "как тэг"
Эта нерабочая конструкция нужна для оптимизации.
page - номер активной вкладки.
Я хочу, чтобы в зависимости от активной по номеру страницы подкидывался active={true} в компонент.
Пример:
page == 0 =&...
0
голосов
1
ответ
111
показов
Подключение API с JavaScript на react-app
У меня есть проект на create-react-app. Есть несколько страниц которые находятся в папке /src/components/. На странице Donate.jsx нужно использовать API(виджет) от trademc(хочу сделать донат для ...
0
голосов
0
ответов
396
показов
Перерисовка компонента при нажатии на элемент li
Подскажите, пожалуйста, как перерисовать имеющийся компонент на react jsx при нажатии на элемент li. Имеется компонент Content. Он отрисовывает список с карточками треков:
export default function ...
0
голосов
2
ответа
258
показов
ReactJS. Конкатенация элементов JSX
Есть два элемента:
elem1 = <div>1</div>;
elem2 = <div>2</div>;
Существует ли способ их конкатенировать в другую переменную newElem, чтобы при
ReactDOM.render(newElem, ...)
...
0
голосов
1
ответ
89
показов
Тэг script не работает в JSX-React, только в html
Есть виджет рейтинга tophotels, нужно отобразить его в react-компоненте на странице, JSX ругается на него, при использовании пакета (react-helmet), так же ничего не происходит. В html-структуре ...
0
голосов
0
ответов
35
показов
Написал код. Но ничего не получается, выходит ошибка: Unexpected token '<'
<script>
// Данные, массив объектов Recipes
const data = [
{
name:"Baked Salmon",
...
0
голосов
1
ответ
89
показов
Как проверить, что переменная false в jsx
изучаю React и не совсем понимаю синтаксис JSX. Есть переменная
const [loading, setLoadong] = useState(false);
Пытаюсь в jsx проверить, что она является false
{ loading ?? null(
<p>false&...
0
голосов
2
ответа
46
показов
JS. React. JSX проблемы
Всем привет!
Имеем 3 файла: App.js; post-list.js; post-list-item.
В файле post-list-item я прописал переменную PostListItem.
В файле post-list.js я создал переменную PostList и вложил список из ...
0
голосов
0
ответов
103
показа
Элементы JSX не могут иметь несколько атрибутов с одним именем. React
Почему когда я указываю тегу input атрибут name в React, выдает эту ш
[{
"resource": "/src/app/components/thumbnails/ThumbnailListItem/index.js",
"owner": "...
0
голосов
0
ответов
12
показов
React JSX В чём отличие "class name" от "cost name" по своему предназначению? [дубликат]
Изучаю React.
Например, что такое class в верстке-html, понимаю. Но что такое class в React js не пойму.
В чем разница между
class name extends Component { render() { return ( ... ) }} и
const name = (...
1
голос
1
ответ
244
показа
вызов обработчика событий из одного компонента в другом компоненте
есть компонент
function App() {
const handleClick= () => {
const popupOpen = document.querySelector('.popup');
popupOpen.classList.add('popup_open')
};
return (
<>
&...
-1
голос
2
ответа
334
показа
Как в React заставить код над return() выполняться после того, как исполнится код внутри return()?
Нужно, чтобы код над return() выполнялся после того, как будет отрисовано DOM-дерево, описанное внутри return(). Вот пример кода, где DOM отрисовывается позже, что приводит к ошибкам как раз по той ...
1
голос
2
ответа
164
показа
Как передать контекст при вызове функции через onClick?
Необходимо, чтобы при клике на "DOM-элемент" блок <p>Hello!</p> внутри него менялся на <p>Goodbye!</p>. Для этого был написан следующий реакт компонент:
import React ...