Usestate - React Cooks Series

Добро пожаловать в серию реакций крючков. В этой серии я пройду через разные крючки, которые были введены в Rection 16.8.

Путь серии

stestate.
useffect.

Почему мы предпочитаем функциональный компонент над компонентом класса в реакции

Функциональный компонент гораздо проще прочитать и тестировать, потому что они являются простой функциями JavaScript без состояния или жизненного цикла-крючков
Функциональный компонент написан более короткий и простым, что облегчает развитие, понимание и тестирование.
С введением Крючки В настоящее время мы можем управлять состоянием в функциональных компонентах.

Что такое крючки?

Крючки были новым дополнением в Реагировать 16,8 Отказ Они позволяют вам использовать состояние и другие функции реагирования без записи класса. Это означает, что вам не нужно использовать компонент класса для использования состояния.

Что такое химический крючок?

Уместитель – это крючок, который позволяет вам иметь переменные состояния в функциональных компонентах.

Прежде всего, давайте импортируем Уместите крючок от реагирования.

import React, { useState } from "react";

Как использовать:

const [name, setName] = useState("Pratap");

Давайте попробуем понять, что мы только что добавили:

Имя : Переменная состояния.
Имя набора : Функция для изменения значения состояния.
Уместите : Usestate React Clooth.
Pratap : Государственное начальное значение.

Пример

import React, { useState } from "react";

const Example = () => {
  const [name, setName] = useState("Pratap");

  return (
    
      {name}
    
  );
};

export default Example;

Теперь добавьте кнопку, которая изменит значение состояния из Pratap к Прасар Отказ

import React, { useState } from "react";

const Example = () => {
  const [name, setName] = useState("Pratap");

  const changeState = () => {
    //This will change the state value
    setName("Prasar");
  };

  return (
    
      {name}
      
    
  );
};

export default Example;

Заключение

В следующей статье в этом серии React Cloots мы узнаем и посмотрим о крючках для использования.

Спасибо за чтение моей первой части в серии React Cooks!

Путь серии

stestate.
useffect.

💌 Если вы хотите получить больше учебных пособий в вашем почтовом ящике, вы можете подписаться на рассылку здесь Отказ

Оригинал: “https://dev.to/pratap2210/usestate-react-hooks-series-pm9”