import React, { Component } from "react";
class Counter extends Component {
// you can either initialize state inside constructor
constructor() {
super();
this.state = {
count: 1,
tags: ["tag1", "tag2", "tag3"],
};
}
// or initialize the state as class field declaration
state = {
count: 1,
tags: ["tag1", "tag2", "tag3"],
};
}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>
);
}import React from 'react';
const App = () => {
const accordionData = {
title: 'Section 1',
content: `Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quis sapiente
laborum cupiditate possimus labore, hic temporibus velit dicta earum
suscipit commodi eum enim atque at? Et perspiciatis dolore iure
voluptatem.`
};
const { title, content } = accordionData;
return (
<React.Fragment>
<h1>React Accordion Demo</h1>
<div className="accordion">
<div className="accordion-item">
<div className="accordion-title">
<div>{title}</div>
<div>+</div>
</div>
<div className="accordion-content">{content}</div>
</div>
</div>
</React.Fragment>
);
};
export default App;class Content extends React.Component {
// ...
componentWillMount() {
this.setState({ activities: data });
}
// ...
}
<div className="accordion">
<div className="accordion-item">
<div
className="accordion-title"
onClick={() => setIsActive(!isActive)}
>
<div>{title}</div>
<div>{isActive ? '-' : '+'}</div>
</div>
{isActive && <div className="accordion-content">{content}</div>}
</div>
</div> const [customers, setCustomers] = useState([]);
const [nextPageURL, setNextPageURL] = useState('');