"2019-02-28 回答 有状态的组件是一种其行为取决于该状态的组件。这意味着在一个组件的两个实例中,即使给这两个实例赋予相同的属性,他们也不一定会有相同的渲染输出,这和纯函数组件不同。 // Stateful class component class App extends Component { constru .."

React 中什么是有状态的组件?

2019-02-28

回答

有状态的组件是一种其行为取决于该状态的组件。这意味着在一个组件的两个实例中,即使给这两个实例赋予相同的属性,他们也不一定会有相同的渲染输出,这和纯函数组件不同。

// Stateful class component
class App extends Component {
  constructor(props) {
    super(props)
    this.state = { count: 0 }
  }
  render() {
    // ...
  }
}

// Stateful function component
function App() {
  const [count, setCount] = useState(0)
  return // ...
} 

加分回答

import {useState} from 'react';

function Counter(){

 let [number,setCount ] = useState(0);

   return (
       <div>
        <h1>{number}</h1>
        <button onClick={()=>setCount(number+1)} >Increment</button>
        <button onClick={()=>setCount(number-1)} >Deccrement</button>
       </div>
   )
}

返回总目录

30 秒面试系列一

  • 30Seconds

    前端面试 30s 系列问答翻译:

    英文原文请看 30-seconds-of-interviews

    99 引用 • 176 回帖 • 5 关注
  • 面试

    面试造航母,上班拧螺丝。多面试,少加班。

    204 引用 • 1136 回帖 • 479 关注
  • React

    React 是 Facebook 开源的一个用于构建 UI 的 JavaScript 库。

    91 引用 • 180 回帖 • 673 关注
感谢    关注    收藏    赞同    反对    举报    分享
回帖    
请输入回帖内容...