高阶函数是接受另一个函数作为参数或返回一个函数作为返回值或两者兼有的函数。const firstOrderFunc = () => console.log('hello, i am a first order function');
const higherOrder = (ReturnFirstOrderFunc) => ReturnFirstOrderFu...
自定义 view--Menu 菜单 - Android - 掘金一、前言 第一次写博客，不知道什么姿势才能显示出一副好像很老练的样子。老大让写一个菜单栏控件，借鉴了Idtk自定义view，站在巨人的肩上...
自定义对话框 - Android - 掘金可以自定义风格，还可以用它实现下载可以自定义进入退出动画等 新版本的对话框封...
仿新...
将
React 组件封装成 Hook 可以让我们更方便地在函数
组件中复用
组件逻辑。下面是一些
封装组件为 Hook 的示例代码：
1. 使用 useState
封装计数器
组件：
```javascript
import { useState } from '
react';
const useCounter = (initialCount = 0, step = 1) => {
const [count, setCount] = useState(initialCount);
const increment = () => setCount(count + step);
const decrement = () => setCount(count - step);
return { count, increment, decrement };
export default useCounter;
使用示例：
```javascript
import useCounter from './useCounter';
function Counter() {
const { count, increment, decrement } = useCounter();
return (
<p>Count: {count}</p>
<button onClick={increment}>+</button>
<button onClick={decrement}>-</button>
2. 使用 useEffect
封装鼠标位置跟踪
组件：
```javascript
import { useState, useEffect } from '
react';
const useMousePosition = () => {
const [position, setPosition] = useState({ x: 0, y: 0 });
useEffect(() => {
const updateMousePosition = (event) => {
setPosition({ x: event.clientX, y: event.clientY });
document.addEventListener('mousemove', updateMousePosition);
return () => {
document.removeEventListener('mousemove', updateMousePosition);
}, []);
return position;
export default useMousePosition;
使用示例：
```javascript
import useMousePosition from './useMousePosition';
function MouseTracker() {
const { x, y } = useMousePosition();
return (
Mouse position: {x}, {y}
以上是两个简单的示例，通过
封装 React 组件为 Hook，可以让我们更好地复用
组件逻辑并在函数
组件中使用。
