Reactjs useReducer递增/递减2而不是1

我只是想在react中学习useReducer钩子。只是玩玩而已。有人能帮我解决一个问题吗？当我点击按钮“加一个单位”或“减一个单位”时，它会带走2。有什么建议吗

也许是地图。更新减速器中状态的方法是否不好

测试代码如下。为了下文的目的，我将其全部放在一个组件中，而不是发布所有上下文内容和子项

非常感谢您的帮助：）

import React，{useReducer}来自“React”
功能测试（）{
常量项目文件=[
{sku:'123456'，说明：'item 1'，库存：5}，
{sku:'654321'，说明：'item 2'，库存：1}，
{sku:'666666'，说明：'item 3'，库存：0}，
]
const reducer=（状态、操作）=>{
开关（动作类型）{
案例“删除行”：
让newstate=state.filter（item=>item.sku！==action.payload）
返回新闻状态
“减去一个单位”的情况：
返回状态.map（项=>{
if（item.sku==action.payload）{
item.stockavailable=item.stockavailable-1；
}
退货项目；
})
案例“加上一个单元”：
返回状态.map（项=>{
if（item.sku==action.payload）{
item.stockavailable=item.stockavailable+1；
}
退货项目；
})
违约：
返回状态
}
}
const[liveItemFile，dispatch]=useReducer（reducer，itemFile）；
报税表（
{liveItemFile.map（（项）=>(
{item.sku}:{item.description}-{item.stockavailable}
分派（{type:'DELETE_LINE'，payload:item.sku}）}>
删除行
分派（{type:'MINUS_ONE_UNIT'，负载：item.sku}）}>
负单位
分派（{type:'PLUS_ONE_UNIT'，负载：item.sku}）}>
加号单位
))}
);
}
导出默认测试；

将减速器的逻辑和初始状态移动到组件之外，就像每次评估渲染一样：

import React，{useReducer}来自“React”；
常量项目文件=[
{sku:“123456”，说明：“项目1”，库存：5}，
{sku:“654321”，说明：“项目2”，库存：1}，
{sku:“666666”，说明：“项目3”，库存：0}，
];
const reducer=（状态、操作）=>{
开关（动作类型）{
案例“删除行”：
让newstate=state.filter（（item）=>item.sku！==action.payload）；
返回新闻状态；
案例“减去一个单位”：
返回状态.map（（项）=>{
if（item.sku==action.payload）{
item.stockavailable=item.stockavailable-1；
}
退货项目；
});
案例“加上一个单元”：
返回状态.map（（项）=>{
if（item.sku==action.payload）{
item.stockavailable=item.stockavailable+1；
}
退货项目；
});
违约：
返回状态；
}
};
功能测试（）{
const[liveItemFile，dispatch]=useReducer（reducer，itemFile）；
返回(
{liveItemFile.map（（项）=>(
{item.sku}:{item.description}-{item.stockavailable}
分派（{type:“DELETE_LINE”，payload:item.sku}）}>DELETE LINE
分派（{type:“减去一个单位”，有效负载：item.sku}）}>减去单位
分派（{type:“PLUS_ONE_UNIT”，有效负载：item.sku}）}>PLUS UNIT
))}
);
}
导出默认测试；

import React, {useReducer} from 'react'

function Test() {

    const itemFile = [
        {sku: '123456', description: 'item 1', stockavailable: 5},
        {sku: '654321', description: 'item 2', stockavailable: 1},
        {sku: '666666', description: 'item 3', stockavailable: 0},
    
      ]

    const reducer = (state,action) => {
        switch (action.type) {
            case 'DELETE_LINE':
                let newstate = state.filter(item => item.sku !== action.payload)
                return newstate
            case 'MINUS_ONE_UNIT':
                return state.map(item => {
                    if(item.sku === action.payload) {
                        item.stockavailable = item.stockavailable-1;
                    }
                    return item;
                  })
            case 'PLUS_ONE_UNIT':
            return state.map(item => {
                if(item.sku === action.payload) {
                    item.stockavailable = item.stockavailable+1;
                }
                return item;
                })
            default:
                return state
        }

    }

    const [liveItemFile, dispatch] = useReducer(reducer, itemFile);

  return (    
    <>
        {liveItemFile.map((item) => (
            <div key={item.sku}>
                {item.sku}: {item.description} - {item.stockavailable}
                <button onClick={() => dispatch({type: 'DELETE_LINE', payload: item.sku})}>
                    DELETE LINE
                </button>

                <button onClick={() => dispatch({type: 'MINUS_ONE_UNIT', payload: item.sku})}>
                    Minus Unit
                </button>
                <button onClick={() => dispatch({type: 'PLUS_ONE_UNIT', payload: item.sku})}>
                    Plus Unit
                </button>
            </div>
        ))}
    </>
  );
}

export default Test;