React useReducer Hook 触发两次如何将 props 传递给减速器

React useReducer Hook 触发两次/如何将 props 传递给减速器？

javascript
import React, { useReducer, useEffect } from 'react';
function reducer(state, action) {
  switch(action.type) {
    case 'INCREMENT':
      return { count: state.count + 1 };
    default:
      return state;
  }
}
function Counter() {
  const [state, dispatch] = useReducer(reducer, { count: 0 });
  useEffect(() => {
    console.log('Reducer function has changed');
  }, [reducer]);
  return (
    
      
Count: {state.count}
       dispatch({ type: 'INCREMENT' })}>
        Increment
      
    
  );
}
export default Counter;

javascript
import React, { useReducer } from 'react';
function reducer(state, action) {
  switch(action.type) {
    case 'INCREMENT':
      return { count: state.count + action.value };
    default:
      return state;
  }
}
function Counter({ initialValue }) {
  const [state, dispatch] = useReducer(reducer, { count: initialValue });
  const increment = () => {
    dispatch({ type: 'INCREMENT', value: 1 });
  };
  return (
    
      
Count: {state.count}
      
        Increment
      
    
  );
}
export default Counter;