DEV Community

Cover image for Daily React 1 - useState
hwangs12
hwangs12

Posted on • Updated on

Daily React 1 - useState

Today's the day I get a lot of stress. I am jobless for about 4 months since I quit my previous job. Even though I don't have a clear goal when I need to get developer job, it is people around me that start to ask when I will get a job. Even a simple question like 'how are you?' stresses me out. So, I started to vent off that stress by coding.

import React, { useState } from "react";

const data = [
    { title: "Fuck you!" },
    { title: "Don't Ask Me When I Am Going to Get a Job!" },
    { title: "Shut Up!" },
];

const Hookers = () => {
    const [title, setTitle] = useState(data[0].title);
    const handleClick = () => {
        if (title === data[0].title) {
            setTitle(data[1].title);
        } else if (title === data[1].title) {
            setTitle(data[2].title);
        } else {
            setTitle(data[0].title);
        }
    };

    return (
        <>
            <div className="title">
                <h1>{title}</h1>
            </div>
            <button className="btn" onClick={handleClick}>
                SWEAR AT WILL
            </button>
        </>
    );
};

export default Hookers;
Enter fullscreen mode Exit fullscreen mode

Here you go! We just set up three different title states to navigate.

sweetcoding

Discussion (0)