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

Jakiś wskazówki do czego spasować id by kilknięty button znikał tylko current note(boollean) {react}

VPS Starter Arubacloud
0 głosów
223 wizyt
pytanie zadane 29 października 2022 w JavaScript przez chrystian Gaduła (4,780 p.)

Prosiłbym o wskazówkę gdzie i jak match id by button o tym samym id zamykał jedynie siblinga(textarea) o tym samym id

Kod z  App

	{[...Array(noteID).keys()].map((item) => {
				return <Notes key={item} noteID={item} Shown={show} toggle={() => SetShow(!show)} />;
			})}

Notes 

function Notes(props) {
	return (
		<div key={props.noteID}>
			{props.Shown ? <textarea key={props.noteID} placeholder="Text Goes Here" /> : null}
			<button key={`Note` + props.noteID} onClick={props.toggle}>
				Note {props.noteID + 1}
			</button>
		</div>
	);
}
export default Notes;

 

komentarz 29 października 2022 przez chrystian Gaduła (4,780 p.)
edycja 29 października 2022 przez chrystian

Jak dostać się do

e.target (element key)
import { useState } from "react";

function Notes(props) {
	const [Shown, setShown] = useState(true);

	function toggle(e) {
		const textarea = e.target.textarea;
		const button = e.target.button;

		console.log(`textare: ${textarea}, button: ${button}`);
		e.preventDefault();
		setShown(!Shown);
	}

	return (
		<form action="return false" key={props.noteID} onSubmit={toggle}>
			{Shown ? <textarea key={props.noteID} placeholder="Text Goes Here" name="textarea" /> : null}
			<button key={`Note` + props.noteID} type="submit" name="button">
				Note {props.noteID + 1}
			</button>
		</form>
	);
}
export default Notes;

if(textarea(key)===button(key){

setShown(!Shown);

)

 

komentarz 30 października 2022 przez ScriptyChris Mędrzec (190,190 p.)

Czy możesz czytelniej opisać swój problem? Chcesz usunąć textarea na kliknięcie w przycisk - w jakim celu?

komentarz 31 października 2022 przez chrystian Gaduła (4,780 p.)
Togglować na przycisk. By dany przycisk zamykał jedynie swojego "Brata"

1 odpowiedź

0 głosów
odpowiedź 31 października 2022 przez chrystian Gaduła (4,780 p.)
edycja 31 października 2022 przez chrystian

Przycisk zamykał jedynie swojego siblinga (textarea) rowiązanie jest pod spodem. Przeniosłem kilk na forma i on toggle textarea

Jedna notka

function Notes(props) {
	const [Shown, setShown] = useState(props.show);

	function toggle(e) {
		e.preventDefault();
		setShown(!Shown);
	}

	return (
		<form action="return false" key={props.noteID} onSubmit={toggle}>
			{Shown ? <textarea key={props.noteID} placeholder="Text Goes Here" name="textarea" /> : null}
			<button key={`Note` + props.noteID} type="submit" name="button" onClick={props.selected}>
				Note {props.noteID + 1}
			</button>
		</form>
	);
}

Tablica Notek

import { react, useState } from "react";
import Notes from "./Notes";
function Notepad() {
	const [noteID, setNoteID] = useState(0);
	const [visible, SetVisible] = useState(false);
	function handleSubmit(e) {
		e.preventDefault();
		setNoteID((prevValue) => prevValue + 1);
	}
	function currentNote(e) {
		e.preventDefault();
	}
	return (
		<div>
			<button onClick={handleSubmit}>New Note</button>
			{[...Array(noteID).keys()].map((item) => {
				return <Notes key={item} noteID={item} selected={currentNote} show={visible} />;
			})}
		</div>
	);
}
export default Notepad;

 

Podobne pytania

0 głosów
1 odpowiedź 221 wizyt
+1 głos
2 odpowiedzi 416 wizyt
pytanie zadane 29 maja 2021 w JavaScript przez ShockWave Bywalec (2,350 p.)
0 głosów
1 odpowiedź 152 wizyt
pytanie zadane 13 września 2018 w JavaScript przez Apper97 Obywatel (1,380 p.)

92,451 zapytań

141,261 odpowiedzi

319,073 komentarzy

61,853 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.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...