Форум программистов, компьютерный форум, киберфорум
React/ReactJS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
 Аватар для DesireToBelieve
37 / 33 / 18
Регистрация: 18.09.2020
Сообщений: 132

Изменить вывод всех сообщений на вывод одного

22.12.2022, 09:14. Показов 298. Ответов 1
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Написал код, который получает через Api все сообщения из бд. Не знаю как исправить, чтобы я вводил ключ, и мне выводил именно одно сообщение по ключу. Пытался менять функцию GetMessages(), в нем писал get('key', '1,0'). Но писало The parameter 'key' must be defined.

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
import React, { FC, ReactElement, useRef, useEffect, useState } from 'react';
import { Client, MessageLookupDto } from '../api/api';
import { FormControl } from 'react-bootstrap';
 
const apiClient = new Client('https://localhost:44356');
 
 
const MessageList: FC<{}> = (): ReactElement => {
    let textInput = useRef(null);
    const [messages, setMessages] = useState<MessageLookupDto[] | undefined>(undefined);
 
    async function getMessages() {
        const messageListVm = await apiClient.getAll('1.0');
        setMessages(messageListVm.messages);
    }
 
    useEffect(() => {
        setTimeout(getMessages, 500);
    }, []);
 
    const handleKeyPress = (event: React.KeyboardEvent<HTMLInputElement>) => {
        if (event.key === 'Enter') {
            const key = event.currentTarget.value;
            event.currentTarget.value = '';
            setTimeout(getMessages, 500);
        }
    };
 
    return (
        <div>
            Messages
            <div>
                <br/>
                <div>Enter the key</div>
                <FormControl ref={textInput} onKeyPress={handleKeyPress} />
            </div>
            <section className='mainsec'>
            <br/>
                {messages?.map((message) => (
                    <div>
                        <div>Title: {message.title}</div>
                        <div>Text: {message.text}</div>
                        <div>View key: {message.uploadUrl?.slice(-36)}</div>
                        <br/>
                    </div>
                ))}
            </section>
        </div>
    );
};
 
export default MessageList;
0
Programming
Эксперт
39485 / 9562 / 3019
Регистрация: 12.04.2006
Сообщений: 41,671
Блог
22.12.2022, 09:14
Ответы с готовыми решениями:

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

Вывод сообщений от сервера, в пределах одного ajax-запроса
Есть страница с формой отправки файла, этот файл отправляется на сервер где с ним могут проделываться разные операции (очень долгая, более...

Вывод на дисплей одного из трех текстовых сообщений, в зависимости от нажатой клавиши.
Здравствуйте. Помогите пожалуйста выполнить задание по Assembler'у. Тема &quot;Программирование внешних устройств&quot;. На форуме нашел...

1
Молодой техлид)
Эксперт JSЭксперт HTML/CSS
 Аватар для mr_dramm
1818 / 1056 / 329
Регистрация: 17.07.2021
Сообщений: 2,147
Записей в блоге: 14
22.12.2022, 10:43
Как пишет Padonak, бомж стаил =)

Попробуйте это

JavaScript
1
2
3
            const key = event.currentTarget.value;
            event.currentTarget.value = '';
            setTimeout(getMessages, 500);
поменять на это

JavaScript
1
2
3
            const key = event.currentTarget.value;
            event.currentTarget.value = '';
            setTimeout(getMessages, 500, key);
И это

JavaScript
1
2
3
4
    async function getMessages() {
        const messageListVm = await apiClient.getAll('1.0');
        setMessages(messageListVm.messages);
    }
поменять на это

JavaScript
1
2
3
4
5
6
7
8
9
10
async function getMessages(key:string) {
    if (isNaN(parseInt(key))) {
        const messageListVm = await apiClient.getAll('1.0');
        setMessages(messageListVm.messages);
    } else {
        const messageListVm = await apiClient.get(key);
        console.log(messageListVm)
        смотрим в консоли что пришло и в зависимости от структуры ответа добавляем в аргумент setMessages
    }
}
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
inter-admin
Эксперт
29715 / 6470 / 2152
Регистрация: 06.03.2009
Сообщений: 28,500
Блог
22.12.2022, 10:43
Помогаю со студенческими работами здесь

Вывод на дисплей одного из трех текстовых сообщений, в зависимости от нажатой клавиши
Вывод на дисплей одного из трех текстовых сообщений, в зависимости от нажатой клавиши &lt;1&gt; - вывод на дисплей первого текстового...

Вывод сообщений поверх всех остальных элементов
Доброго впемени суток подскажите как вывести сообщение по верх всех элементов .... $('&lt;div id=&quot;status&quot;&gt;Данные...

Вывод всех сообщений mysql в которых userid совпадает с $id
У меня есть таблица post состоящая из post_id | kto_id | komu_id | time | text. Нужно сделать вывод всех сообщений имеющих совпадение по...

Вывод на дисплей ФИО и номеров групп для всех студентов одного года
Нужно доделать код или подсказать как сделать, вот заданее: вывод на дисплей ФИО и номеров групп для всех студентов одного года. Если таких...

Выбор по параметру (артикулу) с одного листа-вывод на втором листе всех данных
Здравствуйте, помогите пожалуйста с такой проблемой в Excel. Есть файл, для примера там всего 10 позиций, а в оригинале больше 100. ...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Новые блоги и статьи
Как дизайн сайта влияет на конверсию: 7 решений, которые реально повышают заявки
Neotwalker 08.03.2026
Многие до сих пор воспринимают дизайн сайта как “красивую оболочку”. На практике всё иначе: дизайн напрямую влияет на то, оставит человек заявку или уйдёт через несколько секунд. Даже если у вас. . .
Модульная разработка через nuget packages
DevAlt 07.03.2026
Сложившийся в . Net-среде способ разработки чаще всего предполагает монорепозиторий в котором находятся все исходники. При создании нового решения, мы просто добавляем нужные проекты и имеем. . .
Модульный подход на примере F#
DevAlt 06.03.2026
В блоге дяди Боба наткнулся на такое определение: В этой книге («Подход, основанный на вариантах использования») Ивар утверждает, что архитектура программного обеспечения — это структуры,. . .
Управление камерой с помощью скрипта OrbitControls.js на Three.js: Вращение, зум и панорамирование
8Observer8 05.03.2026
Содержание блога Финальная демка в браузере работает на Desktop и мобильных браузерах. Итоговый код: orbit-controls-threejs-js. zip. Сканируйте QR-код на мобильном. Вращайте камеру одним пальцем,. . .
SDL3 для Web (WebAssembly): Синхронизация спрайтов SDL3 и тел Box2D
8Observer8 04.03.2026
Содержание блога Финальная демка в браузере. Итоговый код: finish-sync-physics-sprites-sdl3-c. zip На первой гифке отладочные линии отключены, а на второй включены:. . .
SDL3 для Web (WebAssembly): Идентификация объектов на Box2D v3 - использование userData и событий коллизий
8Observer8 02.03.2026
Содержание блога Финальная демка в браузере. Итоговый код: finish-collision-events-sdl3-c. zip Сканируйте QR-код на мобильном и вы увидите, что появится джойстик для управления главным героем. . . .
Реалии
Hrethgir 01.03.2026
Нет, я не закончил до сих пор симулятор. Эта задача сложнее. Не получилось уйти в плавсостав, но оно и к лучшему, возможно. Точнее получалось - но сварщиком в палубную команду, а это значит, в моём. . .
Ритм жизни
kumehtar 27.02.2026
Иногда приходится жить в ритме, где дел становится всё больше, а вовлечения в происходящее — всё меньше. Плотный график не даёт вниманию закрепиться ни на одном событии. Утро начинается с быстрых,. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru