react redux importing reducer dispatch-CodePudding

I'm trying to follow the counter example in the react-redux template, but I can't seem to export my own setOwner reducer.

ownerSelector.tsx:

export  const ownerSlice = createSlice({
  name: 'owner',
  initialState,

  reducers:{
    setOwner: (state) => {    //Export this reducer
      let own = document.getElementById("OwnerSelector") as HTMLSelectElement
      state.id = parseInt(own!!.options[own.selectedIndex].value);
    }
  },
  extraReducers: (builder) => {}
})

export const selectOwner= (state: RootState) => state.selectedOwner.id;
export default ownerSlice.reducer;

where I want to import setOwner in carForm.tsx:

import {setOwner} from './ownerSelector'; // error here


    let submitHandler = (e: React.FormEvent<HTMLElement>) => {
        e.preventDefault();

        dispatch(setOwner())
        const formData = {
            car: {
                year: year,
                make: make,
                model: model,
                price: price,
                person_id: owner,
            }
        }
        dispatch(createCarAsync(formData));
        resetState();
    }

The error at the import is: Module '"./ownerSelector"' has no exported member 'setOwner'. Did you mean to use 'import setOwner from "./ownerSelector"' instead?ts(2614)

What am I doing wrong? Thanks.

CodePudding user response：

In redux toolkit and in any redux you need to dispatch actions.

export const { setOwner } = ownerSlice .actions 
//now you can use it in dispatch