reactjs - 当我使用 react Hook 单击按钮时如何更改背景颜色

Question

我正在开发React项目，因为我有App.js组件，在该组件中我有按钮现在请告诉我如何使用react hooks更改按钮背景颜色和按钮文本颜色

这是 App.js

import React, { useState } from 'react';
import './App.css';

function App() {
  return (
    <div className="App">
      <button className='btn btn-primary'>Click here</button>
    </div>
  );
}

export default App;

Answer 1

试试这个

  function App() {
  const [color,setColor]=useState('red');
  const [textColor,setTextColor]=useState('white');
  return (
    <div className="App">
      <button style={{background:color,color:textColor}} className='btn btn-primary' onClick={()=>{setColor("black");setTextColor('red')}}>Click here</button>
    </div>
  );
}

export default App;

或 检查链接:https://stackblitz.com/edit/react-x7mevv