feat: avartar\steps\video\inputnumber 事件优化

src/packages/avatar/__tests__/avatar.spec.tsx

@@ -70,7 +70,7 @@ test('alt props', () => {
 test('should emit active-avatarror event', () => {
   const activeAvatar = jest.fn()
   const { getByTestId } = render(
-    <Avatar data-testid="avatar-click" activeAvatar={activeAvatar} />
+    <Avatar data-testid="avatar-click" onActiveAvatar={activeAvatar} />
   )
   fireEvent.click(getByTestId('avatar-click'))
   expect(activeAvatar).toBeCalled()

src/packages/avatar/avatar.taro.tsx

@@ -25,6 +25,7 @@ export interface AvatarProps extends IComponent {
   alt: string
   style: React.CSSProperties
   activeAvatar: (e: MouseEvent) => void
+  onActiveAvatar: (e: MouseEvent) => void
   onError: (e: any) => void
 }
 
@@ -56,6 +57,7 @@ export const Avatar: FunctionComponent<
     className,
     style,
     activeAvatar,
+    onActiveAvatar,
     onError,
     iconClassPrefix,
     iconFontClassName,
@@ -139,9 +141,8 @@ export const Avatar: FunctionComponent<
   }
 
   const clickAvatar: MouseEventHandler<HTMLDivElement> = (e: any) => {
-    if (props.activeAvatar) {
-      props.activeAvatar(e)
-    }
+    activeAvatar && activeAvatar(e)
+    onActiveAvatar && onActiveAvatar(e)
   }
 
   console.log(

src/packages/avatar/avatar.tsx

@@ -25,6 +25,7 @@ export interface AvatarProps extends IComponent {
   alt: string
   style: React.CSSProperties
   activeAvatar: (e: MouseEvent) => void
+  onActiveAvatar: (e: MouseEvent) => void
   onError: (e: any) => void
 }
 
@@ -56,6 +57,7 @@ export const Avatar: FunctionComponent<
     className,
     style,
     activeAvatar,
+    onActiveAvatar,
     onError,
     iconClassPrefix,
     iconFontClassName,
@@ -111,7 +113,6 @@ export const Avatar: FunctionComponent<
 
   const avatarLength = (children: any) => {
     for (let i = 0; i < children.length; i++) {
-      console.log('child', children[i], children[i].classList)
       if (
         children[i] &&
         children[i].classList &&
@@ -140,9 +141,8 @@ export const Avatar: FunctionComponent<
   }
 
   const clickAvatar: MouseEventHandler<HTMLDivElement> = (e: any) => {
-    if (props.activeAvatar) {
-      props.activeAvatar(e)
-    }
+    activeAvatar && activeAvatar(e)
+    onActiveAvatar && onActiveAvatar(e)
   }
 
   return (

src/packages/avatar/demo.taro.tsx

@@ -140,7 +140,7 @@ const AvatarDemo = () => {
         </Cell>
         <h2>{translated['43f00872']}</h2>
         <Cell>
-          <Avatar icon="my" activeAvatar={activeAvatar} />
+          <Avatar icon="my" onActiveAvatar={activeAvatar} />
         </Cell>
       </div>
     </>

src/packages/avatar/demo.tsx

@@ -142,7 +142,7 @@ const AvatarDemo = () => {
         </Cell>
         <h2>{translated['43f00872']}</h2>
         <Cell>
-          <Avatar icon="my" activeAvatar={activeAvatar} />
+          <Avatar icon="my" onActiveAvatar={activeAvatar} />
         </Cell>
       </div>
     </>

src/packages/avatar/doc.en-US.md

@@ -191,7 +191,7 @@ const App = () => {
   }
   return (
     <>
-      <Avatar icon="my" activeAvatar={activeAvatar} />
+      <Avatar icon="my" onActiveAvatar={activeAvatar} />
     </>
   )
 }
@@ -226,5 +226,6 @@ export default App;
 
 | Event            | Description    | Type     | Arguments |
 | ---------------- | ------------ | -------- | -------- |
-| activeAvatar | Emitted when cell is clicked    | Function | event    |
+| activeAvatar `v1.3.8(Abandon)` | Emitted when cell is clicked    | Function | event    |
+| onActiveAvatar `v1.3.8` | Emitted when cell is clicked    | Function | event    |
 | onError       | Handler when img load error   | Function | event    |

src/packages/avatar/doc.md

@@ -194,7 +194,7 @@ const App = () => {
   }
   return (
     <>
-      <Avatar icon="my" activeAvatar={activeAvatar} />
+      <Avatar icon="my" onActiveAvatar={activeAvatar} />
     </>
   )
 }
@@ -229,5 +229,6 @@ export default App;
 
 | 字段             | 说明         | 类型     | 回调参数 |
 | ---------------- | ------------ | -------- | -------- |
-| activeAvatar | 点击头像触发事件    | Function | event    |
+| activeAvatar `v1.3.8废弃` | 点击头像触发事件    | Function | event    |
+| onActiveAvatar `v1.3.8` | 点击头像触发事件    | Function | event    |
 | onError       | 图片加载失败的事件   | Function | event    |

src/packages/avatar/doc.zh-TW.md

@@ -192,7 +192,7 @@ const App = () => {
   }
   return (
     <>
-      <Avatar icon="my" activeAvatar={activeAvatar} />
+      <Avatar icon="my" onActiveAvatar={activeAvatar} />
     </>
   )
 }
@@ -227,5 +227,6 @@ export default App;
 
 | 字段             | 說明         | 類型     | 回調參數 |
 | ---------------- | ------------ | -------- | -------- |
-| activeAvatar | 點擊頭像觸發事件    | Function | event    |
+| activeAvatar `v1.3.8廢棄` | 點擊頭像觸發事件    | Function | event    |
+| onActiveAvatar `v1.3.8` | 點擊頭像觸發事件    | Function | event    |
 | onError       | 圖片加載失敗的事件   | Function | event    |

src/packages/barrage/doc.en-US.md

@@ -65,7 +65,7 @@ export default App;
 | top  | Vertical distance of barrage    | Number | 10 |
 | loop  | Loop play     | Boolean | true |
 
-### Events
+### Events API
 
 | Event | Description           | Arguments     |
 |--------|----------------|--------------|

src/packages/barrage/doc.md

@@ -65,7 +65,7 @@ export default App;
 | top  | 弹幕垂直距离    | Number | 10 |
 | loop  | 是否循环播放     | Boolean | true |
 
-### Events
+### Events API
 
 | 事件名 | 说明           | 回调参数     |
 |--------|----------------|--------------|

src/packages/barrage/doc.zh-TW.md

@@ -65,7 +65,7 @@ export default App;
 | top  | 彈幕垂直距離    | Number | 10 |
 | loop  | 是否循環播放     | Boolean | true |
 
-### Events
+### Events API
 
 | 事件名 | 說明           | 回調參數     |
 |--------|----------------|--------------|

src/packages/inputnumber/__tests__/inputnumber.spec.tsx

@@ -17,9 +17,9 @@ test('should add step 2 when trigger click plus button', () => {
     <InputNumber
       modelValue={1}
       step={2}
-      overlimit={overlimit}
-      add={add}
-      change={change}
+      onOverlimit={overlimit}
+      onAdd={add}
+      onChangeFuc={change}
     />
   )
   const iconPlus = container.querySelectorAll('.nut-icon-plus')[0]
@@ -37,9 +37,9 @@ test('should minis step 2 when trigger click minis button', () => {
     <InputNumber
       modelValue={3}
       step={2}
-      overlimit={overlimit}
-      reduce={reduce}
-      change={change}
+      onOverlimit={overlimit}
+      onReduce={reduce}
+      onChangeFuc={change}
     />
   )
   const iconMinus = container.querySelectorAll('.nut-icon-minus')[0]
@@ -58,9 +58,9 @@ test('should render max props', () => {
       modelValue={100}
       min="2"
       max="100"
-      overlimit={overlimit}
-      add={add}
-      change={change}
+      onOverlimit={overlimit}
+      onAdd={add}
+      onChangeFuc={change}
     />
   )
   const iconPlus = container.querySelectorAll('.nut-icon-plus')[0]
@@ -79,9 +79,9 @@ test('should render min props', () => {
       modelValue={2}
       min="2"
       max="100"
-      overlimit={overlimit}
-      reduce={reduce}
-      change={change}
+      onOverlimit={overlimit}
+      onReduce={reduce}
+      onChangeFuc={change}
     />
   )
   const iconMinus = container.querySelectorAll('.nut-icon-minus')[0]
@@ -107,7 +107,7 @@ test('should not trigger click when disabled props to be true', () => {
 test('should not focus input when readonly props to be true', () => {
   const focus = jest.fn()
   const { container } = render(
-    <InputNumber readonly modelValue={2} focus={focus} />
+    <InputNumber readonly modelValue={2} onFocus={focus} />
   )
   const iconMinus = container.querySelectorAll('.nut-icon-minus')[0]
   fireEvent.click(iconMinus)
@@ -138,7 +138,12 @@ test('should update input value when inputValue overlimit', () => {
   const change = jest.fn()
   const blur = jest.fn()
   const { container } = render(
-    <InputNumber modelValue={2} max="100" change={change} blur={blur} />
+    <InputNumber
+      modelValue={2}
+      max="100"
+      onChangeFuc={change}
+      onBlurFuc={blur}
+    />
   )
   const input = container.querySelectorAll('input')[0]
   input.value = '200'

src/packages/inputnumber/demo.taro.tsx

@@ -115,7 +115,7 @@ const InputNumberDemo = () => {
             modelValue={inputState.val3}
             min="10"
             max="20"
-            overlimit={overlimit}
+            onOverlimit={overlimit}
           />
         </Cell>
         <h2>{translated['181965e2']}</h2>
@@ -137,7 +137,11 @@ const InputNumberDemo = () => {
         </Cell>
         <h2>{translated['65bafb1d']}</h2>
         <Cell>
-          <InputNumber modelValue={inputState.val7} change={onChange} isAsync />
+          <InputNumber
+            modelValue={inputState.val7}
+            onChangeFuc={onChange}
+            isAsync
+          />
         </Cell>
         <h2>{translated['7e2394ae']}</h2>
         <Cell>

src/packages/inputnumber/demo.tsx

@@ -106,7 +106,7 @@ const InputNumberDemo = () => {
             modelValue={inputState.val3}
             min="10"
             max="20"
-            overlimit={overlimit}
+            onOverlimit={overlimit}
           />
         </Cell>
         <h2>{translated['181965e2']}</h2>
@@ -128,7 +128,11 @@ const InputNumberDemo = () => {
         </Cell>
         <h2>{translated['65bafb1d']}</h2>
         <Cell>
-          <InputNumber modelValue={inputState.val7} change={onChange} isAsync />
+          <InputNumber
+            modelValue={inputState.val7}
+            onChangeFuc={onChange}
+            isAsync
+          />
         </Cell>
         <h2>{translated['7e2394ae']}</h2>
         <Cell>

src/packages/inputnumber/doc.en-US.md

@@ -96,7 +96,7 @@ const App = () => {
   }
   return (
     <>
-      <InputNumber modelValue={inputState.val3} min="10" max="20" overlimit={overlimit} />
+      <InputNumber modelValue={inputState.val3} min="10" max="20" onOverlimit={overlimit} />
     </>
   )
 }
@@ -223,7 +223,7 @@ const App = () => {
   }
   return (
     <>
-      <InputNumber modelValue={inputState.val7} change={onChange} isAsync />
+      <InputNumber modelValue={inputState.val7} onChangeFuc={onChange} isAsync />
     </>
   )
 }
@@ -280,9 +280,15 @@ export default App;
 
 | Event    | Description                   | Arguments                       |
 |-----------|------------------------|--------------------------------|
-| add       | Triggered when the Add button is clicked     | event: Event                   |
-| reduce    | Triggered when the decrease button is clicked     | event: Event                   |
-| overlimit | Triggered when an unavailable button is clicked | event: Event                   |
-| change    | Triggered when the value changes           | value:  number , event : Event |
-| blur      | Triggered when the input box blur   | event: Event                   |
-| focus     | Triggered when the input box focus   | event: Event                   |
+| add    `v1.3.8(Abandon)`   | Triggered when the Add button is clicked     | event: Event                   |
+| reduce   `v1.3.8(Abandon)` | Triggered when the decrease button is clicked     | event: Event                   |
+| overlimit `v1.3.8(Abandon)` | Triggered when an unavailable button is clicked | event: Event                   |
+| change `v1.3.8(Abandon)`    | Triggered when the value changes           | value:  number , event : Event |
+| blur `v1.3.8(Abandon)`      | Triggered when the input box blur   | event: Event                   |
+| focus `v1.3.8(Abandon)`     | Triggered when the input box focus   | event: Event                   |
+| onAdd `v1.3.8`       | Triggered when the Add button is clicked     | event: Event                   |
+| onReduce `v1.3.8`    | Triggered when the decrease button is clicked     | event: Event                   |
+| onOverlimit `v1.3.8` | Triggered when an unavailable button is clicked | event: Event                   |
+| onChangeFuc `v1.3.8`    | Triggered when the value changes           | value:  number , event : Event |
+| onBlurFuc `v1.3.8`      | Triggered when the input box blur   | event: Event                   |
+| onFocus `v1.3.8`     | Triggered when the input box focus   | event: Event                   |

src/packages/inputnumber/doc.md

@@ -95,7 +95,7 @@ const App = () => {
   }
   return (
     <>
-      <InputNumber modelValue={inputState.val3} min="10" max="20" overlimit={overlimit} />
+      <InputNumber modelValue={inputState.val3} min="10" max="20" onOverlimit={overlimit} />
     </>
   )
 }
@@ -222,7 +222,7 @@ const App = () => {
   }
   return (
     <>
-      <InputNumber modelValue={inputState.val7} change={onChange} isAsync />
+      <InputNumber modelValue={inputState.val7} onChangeFuc={onChange} isAsync />
     </>
   )
 }
@@ -279,9 +279,15 @@ export default App;
 
 | 事件名    | 说明                   | 回调参数                       |
 |-----------|------------------------|--------------------------------|
-| add       | 点击增加按钮时触发     | event: Event                   |
-| reduce    | 点击减少按钮时触发     | event: Event                   |
-| overlimit | 点击不可用的按钮时触发 | event: Event                   |
-| change    | 值改变时触发           | value:  number , event : Event |
-| blur      | 输入框失去焦点时触发   | event: Event                   |
-| focus     | 输入框获得焦点时触发   | event: Event                   |
+| add  `v1.3.8废弃`     | 点击增加按钮时触发     | event: Event                   |
+| onAdd  `v1.3.8`     | 点击增加按钮时触发     | event: Event                   |
+| reduce   `v1.3.8废弃` | 点击减少按钮时触发     | event: Event                   |
+| onReduce   `v1.3.8` | 点击减少按钮时触发     | event: Event                   |
+| overlimit `v1.3.8废弃` | 点击不可用的按钮时触发 | event: Event                   |
+| onOverlimit `v1.3.8` | 点击不可用的按钮时触发 | event: Event                   |
+| change `v1.3.8废弃`    | 值改变时触发           | value:  number , event : Event |
+| onChangeFuc `v1.3.8`    | 值改变时触发           | value:  number , event : Event |
+| blur `v1.3.8废弃`      | 输入框失去焦点时触发   | event: Event                   |
+| onBlurFuc `v1.3.8`      | 输入框失去焦点时触发   | event: Event                   |
+| focus `v1.3.8废弃`     | 输入框获得焦点时触发   | event: Event                   |
+| onFocus `v1.3.8`     | 输入框获得焦点时触发   | event: Event                   |