You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
// 导入 React 包
import React from 'react'
// 函数组件的创建和渲染
// 创建
function Hello() { // 定义事件回调函数
const clickHandle = () => { alert('函数组件中的事件被触发了') } // 事件绑定
return <div onClick={clickHandle}>Hello everbody</div> }
// 类组件的创建和渲染
// 创建
class HelloComponent extends React.Component { // 事件回调函数(标准写法,可以避免this指向问题)
// 这样写 回调函数中的this指向的是当前的组件实例对象
clickHandle = () => { alert('类组件中的事件被触发了') } render() { // 事件绑定
return <div onClick={this.clickHandle}>this is class Component</div> } }
function App() { return ( <div> <Hello /> <Hello></Hello> <HelloComponent /> <HelloComponent></HelloComponent> </div> ) }
export default App
|