使用 CreateContext 时更改 <select> 上的值

Question

大家好，我正在尝试使用 CreateContext 函数进行蓝色选择，并且在一两次应用程序发送错误后，这意味着它只工作一两次然后停止发送的错误

这是数据

const FristSelectData = () => {
  const [state, setState] = useContext(FristSelectContext);
  console.log('state',state);

  return (
    <>
      <TableCell align="center"> 
          <FormControl style={ {margin: 1 ,minWidth: 120} }>
            <InputLabel htmlFor="grouped-native-select">Fristbegin</InputLabel>
                <Select native defaultValue="" 
                        id="grouped-select"
                        // open={state.select}
                        // onClose={() => setState(state => ({ ...state, select: false }))}
                        // onOpen={() => setState(state => ({ ...state, select: true }))}
                        value={state.frist}
                        onChange={(e) => 
                          {console.log('e',e.target)
                          setState( state => ({ ...state, frist: e.target.value})
                          )}}
                        >
                        <option value={1}>Sofort</option>
                        <option value={2}>Zum Jaresende</option>
                </Select>
        </FormControl>
      </TableCell>
    </>
  )
}


export default FristSelectData

这是上下文组件

import React, { useState } from 'react';


const FristSelectContext = React.createContext([{}, () => {}]);

const FristSelectProvider = (props) => {
  const [state, setState] = useState({ frist: ''});
  
  return (
    <FristSelectContext.Provider value={[state, setState]}>
      {props.children}
    </FristSelectContext.Provider>
  );
};

export { FristSelectContext, FristSelectProvider };

这是错误，它的值是 1 或 2 没有意义

TypeError: Cannot read property 'value' of null
(anonymous function)
C:/git/frontend/EDIB_CMS/OrchardCMS/src/Orchard.Web/Modules/Begis.AkteV2/begis.akte.v2/src/components/Settings/ManagementSettings/DeletionPeriodConfig/FristSelectData.js:28
  25 | value={state.frist}
  26 | onChange={(e) => 
  27 |   {console.log('e',e.target)
> 28 |   setState( state => ({ ...state, frist: e.target.value})
     | ^  29 |   )}}
  30 | >
  31 | <option value={1}>Sofort</option>
View compiled
▶ 5 stack frames were collapsed.
FristSelectProvider
C:/git/frontend/EDIB_CMS/OrchardCMS/src/Orchard.Web/Modules/Begis.AkteV2/begis.akte.v2/src/components/Settings/ManagementSettings/DeletionPeriodConfig/FristSelectContext.js:6
  3 | 
  4 | const FristSelectContext = React.createContext([{}, () => {}]);
  5 | 
> 6 | const FristSelectProvider = (props) => {
  7 |   const [state, setState] = useState({ frist: ''});
  8 |   
  9 |   return (

Answer 1

我只是解决问题，我必须将值保存在 const 像这样，它会工作的

onChange={(e) => {
                            console.log('e', e.target);
                            const stuff = e.target.value;
                            setState((state) => ({...state, frist: stuff}));
                        }}