• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

react input value edit

Aruba Cloud - Virtual Private Server VPS
0 głosów
192 wizyt
pytanie zadane 5 sierpnia 2020 w JavaScript przez rob Bywalec (2,440 p.)

Witam,

mam taki problem, który niestety mnie przerósł. Mam form w którym dodaję na przykład tytuł taska i to działa, ale pokusiłem się o możliwość jego edycji i to mnie przerosło, mam taki kod

 <input onChange={handleChange} onMouseDown={mouseEnter} onMouseLeave={mouseLeave}
                    value={filterToEdit.length < 1 ? (null) : (console.log(newTask.title), newTask.title)}
                    id='newTask' type="text" />

który powoduje, że w trybie edycji wyświetla mi się w value aktualny stan i tym samum w polu input

 const mouseEnter = (e) => {
        e.target.value = null
    }
    const mouseLeave = (e) => {
        if (e.target.id === 'newTask') {
            setNewTask({ newTask, title: e.target.value })
        }
    }

ten kod miał usuwać poprzez mouseEnter to co się wyświetliło

a mouseLeave miał ustawiać nowy stan na nową wartość e.target.value, ale to nie działa bo przcież e.target.value jest ustawione na null

Jak to rozwiązać? proszę o radę, może w ogóle źle podchodzę do problemu....?

komentarz 5 sierpnia 2020 przez Paweł Nąckiewicz Nałogowiec (48,990 p.)
Nie do końca umiem sobie wyobrazić to co robisz. A co się stanie jeśli zamiast nulla wstawisz ''?
komentarz 5 sierpnia 2020 przez rob Bywalec (2,440 p.)
Jezeli zamiast null ustawię "" jest tak samo,

Musze w polu input wyświetlić stan który użytkownik ustawił wcześniej, robię to poprzez value, a następnie doprowadzić do tego aby to value było edytowalne - żeby na miejsce ustawionego wcześniej stanu-tytułu taska wprowadzić nowy
komentarz 5 sierpnia 2020 przez Paweł Nąckiewicz Nałogowiec (48,990 p.)
wystawisz mi to na jakimś repo?
komentarz 5 sierpnia 2020 przez rob Bywalec (2,440 p.)

dzięki, 

ale rozwiązałem problem ma to być tak

 const mouseEnter = (e) => {
        setNewTask({ newTask, title: null })

    }
    const mouseLeave = (e) => {

        setNewTask({ newTask, title: e.target.value })
    }

ale przy okazji padło mi dodawanie nowego elementu, więc dojrzałem do tego aby dodawanie nowego taska było w jednym komponencie a edytowanie w drugim....

Zaloguj lub zarejestruj się, aby odpowiedzieć na to pytanie.

Podobne pytania

0 głosów
1 odpowiedź 191 wizyt
pytanie zadane 4 czerwca 2021 w JavaScript przez ShockWave Bywalec (2,350 p.)
0 głosów
1 odpowiedź 851 wizyt
0 głosów
1 odpowiedź 1,276 wizyt
pytanie zadane 15 czerwca 2020 w PHP przez Filipczak Gaduła (4,020 p.)

93,322 zapytań

142,319 odpowiedzi

322,387 komentarzy

62,651 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj

Wprowadzenie do ITsec, tom 1 Wprowadzenie do ITsec, tom 2

Można już zamawiać dwa tomy książek o ITsec pt. "Wprowadzenie do bezpieczeństwa IT" - mamy dla Was kod: pasja (użyjcie go w koszyku), dzięki któremu uzyskamy aż 15% zniżki! Dziękujemy ekipie Sekuraka za fajny rabat dla naszej Społeczności!

...