Answers for "why we use usestate in react"

9

reactjs useState() hook

import React, { useState } from 'react';

function Example() {
  // Declare a new state variable, which we'll call "count"  
  const [count, setCount] = useState(0);
  return (
    <div>
      <p>You clicked {count} times</p>
      <button onClick={() => setCount(count + 1)}>
        Click me
      </button>
    </div>
  );
}
Posted by: Guest on September-08-2020
0

useState hook example

function LoginForm() {
  const [form, setState] = useState({
    username: '',
    password: ''
  });

  const printValues = e => {
    e.preventDefault();
    console.log(form.username, form.password);
  };

  const updateField = e => {
    setState({
      ...form,
      [e.target.name]: e.target.value
    });
  };

  return (
    <form onSubmit={printValues}>
      <label>
        Username:
        <input
          value={form.username}
          name="username"
          onChange={updateField}
        />
      </label>
      <br />
      <label>
        Password:
        <input
          value={form.password}
          name="password"
          type="password"
          onChange={updateField}
        />
      </label>
      <br />
      <button>Submit</button>
    </form>
  );
}
Posted by: Guest on July-22-2021
1

usestate in react

const [x, setx] = useState(0);
Posted by: Guest on July-13-2021
1

How to usestate in react

...
const [count, setCounter] = useState(0);
const [moreStuff, setMoreStuff] = useState(...);
...

const setCount = () => {
    setCounter(count + 1);
    setMoreStuff(...);
    ...
};
Posted by: Guest on May-11-2021
0

usestate in react

The initial value will be assigned only on the initial render (if it’s a function, it will be executed only on the initial render).
Posted by: Guest on May-23-2021
0

react usestate nedir

import { useState, useEffect } from 'react';

function ArkadasDurumu(props) {
  const [onlineMi, onlineDurumuAta] = useState(null);

  function handleDurumuDegistir(durum) {
    onlineDurumuAta(durum.onlineMi);
  }

  useEffect(() => {
    ChatAPI.arkadasDurumunaAboneOl(props.arkadas.id, handleDurumuDegistir);

    return () => {
      ChatAPI.arkadasDurumuAboneligindenCik(props.arkadas.id, handleDurumuDegistir);
    };
  });

  if (onlineMi === null) {
    return 'Yükleniyor...';
  }
  return onlineMi ? 'Online' : 'Offline';
}
Posted by: Guest on October-26-2021

Browse Popular Code Answers by Language