How to create increase/decrease button with default 0 middle?

Question

Hi Team I need some help want to create an increase and decrease button that will both be clicked in react app. when the button is default 0 must be blur non clicked when increase total value must also increase.

Farhan Ahmed · Answer

Install bootstrap use below command npm install bootstrap

Guest User · Answer

Hi Do i get rid of this error on my App.js Module not found: Error: You attempted to import ../node_modules/bootstrap/dist/css/bootstrap.min.css which falls outside of the project src/ dire Also last question have five files Footer.js and import them all on my App.js see below because i want to implement a unique function on App.js that decrease and increase values. // App.js import Header from './components/Header'; import Navbar from './components/Navbar'; import Content from './components/Content'; import Sidebar from './components/Sidebar'; import Footer from './components/Footer'; import ../node_modules/bootstrap/dist/css/bootstrap.min.css; function App() { return ( ); // function to show decrease and increase functionality function Increase_Decrease() { } } export default App;

Farhan Ahmed · Answer

Hi Check below code. import React { useState } from react ; import ./App.css ; import ../node_modules/bootstrap/dist/css/bootstrap.min.css ; function App() { const [counter setCounter] = useState(0); const incrementCount = () => { // Update state with incremented value setCounter(counter + 1); }; const decrementCount = () => { // Update state with incremented value setCounter((c) => Math.max(c - 1 0)); }; return ( className= btn-group role= group aria-label= Basic mixed styles example > type= button className= btn btn-danger onClick={decrementCount} > - number min= 1 value={counter} className= form-control /> type= button className= btn btn-success onClick={incrementCount} > + ); } export default App;