React tutorial in Hindi #16 Hide , Show and Toggle in ReactJs

[@NikhilKumar-pb1pj]

jis bande me knowledge pura rhta h whi itna clear bta skta h , maine dekha h apki sb videos clear and cut rhta h ❤️, ni to baki log itna complex kr dete h code ko

[@bkishwarchavan7787]

correct bhai.......baki sah chutiya hai...or hame bhi chutiya banate hai

[@ALOKKUMAR-qj2bw]

using (!argument) to toggle , Awesome. I remember once stuck to apply this simple function.

[@noorb374]

this question was asked for coding challenge in interview but i could not solve it ... how simple this was

[@thecomputerworld6021]

Jai shree ram 🚩🚩🚩 sir hats off to you the way u make understand is unique

[@codestepbystep]

Jai shree ram . Thanx bro

[@mathis-meth4229]

Sir you take the best examples to explain concepts.⚡⚡⚡

[@theroyalthings]

Assalamiolikum Dear SIR, i am thankful to you that you are providing great learning concepts for all developers. 😊😉

[@NoorFatima-qx7rv]

Thanksssssssssss A lot Sir Really very Awesome Tutorial in very easy way and short time you explain each and Everything very clearly thank you sooooo much Stay Blessed 😇😇

[@nstha8848]

To those who want to toggle the button name here is:
const [name, setName] = useState('Hide');
const [visible, setVisible] = useState(true);
const toggle = () => {
setVisible(!visible);
!visible ? setName('Hide') : setName('Show');
}
return (

{
visible ? Hello Everyone :
}
toggle()}>{name}

)

[@devanshurawat826]

In my knowledge, there are 4 ways in web of hide-show/toggle :
CSS ->
button: hower { display: none; }
jQuery->
$this.show(){ }
Angular->
ng-show / ng-hide
React->
useState hook

[@vigneshlokeshbabu1686]

sir thank u so much for helping me with ur awesome and easy way of learning.... this video of urs helped me solve a few things in my react page during the neck of the moment of submission.

[@karenespinozadelosmonteros4726]

I loved, thank u so much, excelent video. I had any problems but this video helped me. Like!

[@chandreshkumar9046]

thanks you sir, I am big fan of your.

[@ShimantaDas-s3f]

how to get input box value
for this we need to use ‘e.target.value’ . here ‘e’ is the argument.
change
it will calls setData() function.
const[name,setName]=useState("paul walker");
function setData(){
setName("brian o corner");
}
we also need to import {useState} from React into current working js.
when we hit the button, then setData() function get called and calls setName() function from useState.
show/hide react component
under App()
{ title ? : null }

hide


show
under return
const[title,setTitle]=useState();

function hideP(){
setTitle(false);
}
function showP(){
setTitle(true);
}

[@NoumanKhan-ck7vx]

god level programeer

[@aasimameer3294]

sir u r amazing....Adorable

[@smis5525]

very very very nice sir. keep it up. pls make project in reactjs with PHP and Mysql

[@amansharma5452]

How to add smooth transition styling while hiding and showing a div?

[@sumondatta6595]

thank you

[@surendrajat7290]

very nice video

[@faizahmed688]

inbuilt function use karte jQuery ka

[@shorttutorials205]

in jquery we are using jquery inbulid hide and show method, i guess we should not use jquery method in react beacuse this is not a good manner to use jquery hide and show beacuse react have its functionality to show and hide using state so according to me this is not a good idea to use jquery show and hide in readt. Please correct if i am wrong

[@sultanasim5267]

hide() method or css('display', 'none')

[@AjeetYadav-dg1to]

Button ke click pe kisi other div pe class toggle kaise kare as per our need
want to do something like this below :-
$(".fab-icon-holder").click(function (e) {
e.stopPropagation();
$(".fab-container").toggleClass('crosshow');
});

[@muhammadsohail862]

Assalamoalaikum Dear SIR, i am thankful to you that you are providing great learning concepts for all developers i have a question how to set up and down arrow show in view

[@Mr-sr9ie]

Bhai,
meko sirf child element toggle karna hai wo kaise karna hai.
Mere pass multiple dropdown option hai
Aise use karunge to sare dropdown ek saath show/hide honge na .

[@ravi_pk]

Jquery me function use karte hai

[@bhanvidudeja9113]

How can we hide any parent div with the help of CSS?

[@anuragghimire3735]

🙏🙏🙏🙏

[@kodakstudiowebs]

If we want to hide full div or class... what should I do? {getTogm ? 'Toggle show' : null } isme string ki jagah kya set kre?

[@codestepbystep]

String is jgh div lga do aap...

[@kodakstudiowebs]

@@codestepbystep nai.. if some where page me koi container div h.. use toggle k lie.. kya kre. Ese time pe uske id ko kese toggle kere??

[@codestepbystep]

React me id se toogle nhi krte... aap pure div ko component me rkho, fir usko string ji jgh rkho agr jyada bda div h to,
Isme jquery ke jiasa nhi hota bhai

[@kodakstudiowebs]

@@codestepbystep ok.. thank you 🙏

[@rajaasim4474]

{getTogm && 'Togglee show'}

[@Codingkite]

Sir State use Karo na

[@codestepbystep]

Bhai state hi use kri hai 🙂

[@Codingkite]

@@codestepbystep constructor vale

[@codestepbystep]

Wo class component me hota h... ab react me class component kam use gite h bhai

[@rajendrastore-p5i]

why use react.usestate not only usestate

[@RAVIRAJLADHA]

he has not taught useState till now, y r u usng it?

[@pythonenthusiast9292]

agar jab bhi mai hide pe click karra hu to button ka naam show pe change karna hai aur show pe click kaeu to uska naam hide me change karna hai..
to ye mai kaise karunga?

[@iTapas]

Instead of toggle simple write {status? "Hide":"Show"}

[@ganeshshankarpelli3094]

let btnText ="show";
function App() {
const [status, setStatus] = React.useState(false)
function BtnName() {
setStatus(!status)
if (status===false) {
btnText="hide";
} else if (status === true ){
btnText= "show";
}
}
return (

{
status? shravani : null
}
{btnText}

);
}
export default App;