-2

enter image description here about code have a error is "Argument of type 'string | null' is not assignable to parameter of type 'string'."

the function defined is:

export const getShoppingCart = createAsyncThunk(
  "shoppingCart/getShoppingCart",
  async (jwt: string, thunkAPI) => {
    const { data } = await axios.get(
      `https://e9e0fde5-0f50-4037-af58-6b187be97f69.mock.pstmn.io/shoppingCart`,
      {
        headers: {
          Authorization: `bearer ${jwt}`,
        },
      }
    );
    return data.shoppingCartItems;
  }
);

The store type is:

interface ShoppingCartState {
  loading: boolean;
  error: string | null;
  items: any[];
}

const initialState: ShoppingCartState = {
  loading: true,
  error: null,
  items: [],
};
The slice is:

export const shoppingCartSlice = createSlice({
  name: "shoppingCart",
  initialState,
  reducers: {},
  extraReducers: {
    [getShoppingCart.pending.type]: (state) => {
      state.loading = true;
    },
    [getShoppingCart.fulfilled.type]: (state, action) => {
      state.items = action.payload;
      state.loading = false;
      state.error = null;
    },
    [getShoppingCart.rejected.type]: (
      state,
      action: PayloadAction<string | null>
    ) => {
      state.loading = false;
      state.error = action.payload;
    }
   }
  })

My question is whether there is a more standardised solution to it? I am learning about it. Thanks!

I can fix it by Ternary Operators. like this:

useEffect(() => {
    dispatch(getShoppingCart(jwt ? jwt : ''))
  }, [jwt, dispatch])

Improve this question
11
  • 1
    that's probably all you need to do. you could also add an if statement to make sure jwt is defined. Commented Dec 28, 2022 at 21:35
  • 1
    In the future, please copy your code as text and not images. Second, it seems wherever s.user.token is defined it has a different data type than "string" which is what your function is looking for. You can try to change the getShoppingCart function to take a "string | null". Commented Dec 28, 2022 at 21:37
  • @Rick The fact that ternary operators and conditional judgements are basically equivalent Commented Dec 28, 2022 at 21:37
  • @MarcPfister Thank you for your suggestion, but the code does not show the error alert symbol. In future I will use code rather than images. The jwt in the code must be a string, not a null, so I can't use "string | null" where it is defined Commented Dec 28, 2022 at 21:42
  • 2
    Please do not upload images of code/data/errors. Commented Dec 28, 2022 at 21:49

2 Answers 2

Reset to default
0

'string | null' is not assignable to parameter of type 'string'

Because user.token is string | null you cannot use it for getShoppingCart (which expects string)

Fix

If you are sure its not null you can use a non null assertion i.e. getShoppingCart(jwt!)

More

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

Throwing an error would probably be more helpful than using !
This is a duplicate many times over...
That's exactly the answer I was looking for, a standard specification. Maybe it's not. Unfortunately the question does repeat itself. At first I just didn't understand the other posts where this answer was given.
0

First of all, I would like to thank the people who helped me. Although it did not help me to solve the problem. But provided me with a different way of thinking. There are always those two self-righteous people who not only don't offer help, but give me 2 points less. It seems I overestimated this site. I ended up solving the problem myself. Sharing it with you guys and those two smug people too. Please give me back my precious points, don't expect 0+, 0 is fine！

 const jwt = useSelector((s) => s.user.token) as string
  const dispatch = useDispatch()
  useEffect(() => {
    dispatch(getShoppingCart(jwt))
  }, [jwt, dispatch])

Improve this answer

2 Comments

const jwt = useSelector((s) => s.user.token)! would do the same. I still believe that the problem should be solved by declaring user.token type in a different way or with throwing an error
@Konrad yes! i tried,and success. but i cant understand. The two cents worth of superlatives, learned a trick. It is likely that your understanding is correct, I will think about it again

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.