From 5d783709c67092fe0c6a6d904020fd1607d76b22 Mon Sep 17 00:00:00 2001
From: ruilinsun <garrolinlin@gmail.com>
Date: Tue, 24 Sep 2024 17:01:03 -0700
Subject: [PATCH] add react syn

---
 common_usage_case/react.js | 36 ++++++++++++++++++++++++++++++++++++
 1 file changed, 36 insertions(+)
 create mode 100644 common_usage_case/react.js

diff --git a/common_usage_case/react.js b/common_usage_case/react.js
new file mode 100644
index 0000000..bd705e2
--- /dev/null
+++ b/common_usage_case/react.js
@@ -0,0 +1,36 @@
+function getArticleTem() {
+  //简单传递
+  const clickHandler = () => {
+    console.log('')
+  }
+  //事件参数e，e可以被console接收
+  const clickHandler = (e) => {
+    console.log('',e)
+  }
+  return(
+  <div className = 'getArticleTem'>
+  <button onClick = {clickHandler}></button>
+  {
+    articleType === 1 ? <span>Loading...</span> :
+    articleType === 2 ? <span>Error occurred</span> :
+    articleType === 3 ? <span>Operation successful</span> :
+    <span>Unknown status</span>
+  }
+  </div>
+  )
+  
+  //形参传递实参 : 利用箭头函数的形式引用
+  const clickHandler = (name) => {
+    console.log('',name)
+  }
+  return(<button onClick = {() => clickHandler('jack')}> clickme </button>)
+  
+  
+  //同时传递事件对象和自定义参数
+  const clickHandler = (name , e) => {
+    console.log('',name , e)
+  }
+  return(<button onClick = {(e) => clickHandler('jack' ,e)}> clickme </button>)
+  
+  }
+  
\ No newline at end of file