小编Dij*_*lex的帖子

我正在使用 rtq 查询，并且有一个端点，该端点从全局存储中获取 azure-ad oid 并向后端进行查询以检查用户是否存在于后端以检查用户是否存在。如果用户存在，那么我将用户重定向到仪表板，否则我不会重定向用户。

问题在于，尽管尝试阻止该端点上的缓存，但它仍然使用缓存的数据，并且当真实数据来自服务器时，重定向已经发生。以下是我为防止这种情况发生而采取的一些步骤。

1. 使用重新获取
2. 设置 refetchOnMountOrArgChange: true,
3. 设置 keepUnusedDataFor: 0.0001 几乎立即使缓存失效

关键是我不希望这个端点使用任何缓存的数据。

以下是我的组件：

 const [isSignedIn] = useIsSignedIn();
  const history = useHistory();
  const dispatch = useAppDispatch();
  const ongraphLogin = async (role: string) => {
    if (Providers.globalProvider.login) {
      dispatch(setloginType(role));

      await Providers.globalProvider.login();
    }
  };
  const userState = useAppSelector(state => state.userState);

 
  console.log(userState?.currentUser?.id);
  const { data, error, isLoading, refetch } = useGetUserByOidQuery(userState?.currentUser?.id, {
    skip: isSignedIn,
    refetchOnMountOrArgChange: true
  });
  
  useEffect(() => {
    refetch();
    // console.log(res);
    if (isSignedIn) {
      console.log('I am in');
      // …

JavaScript 和我正在从https://picsum.photos加载随机图像，但它不起作用。请注意，目前我不想在 next.js 中使用新的图像优化。本地图像有效，但外部图像无效。下面是我的代码和 next.config.js

<Slider
            {...settingsThumbs}
            asNavFor={nav1}
            ref={slider => setSlider2(slider)}
          >
            {slidesData.map(slide => (
              <div className='slick-slide' key={slide.id}>
                <img
                  className='slick-slide-image'
                  src={`https://picsum.photos/800/400?img=${slide.id}`}
                  alt='sfd'
                />
              </div>
            ))}
          </Slider>

下面是我的 next.js 配置

module.exports = {
  images: {
    domains: ['https://picsum.photos/']
  }
};

我第一次将 MUI 与 TypeScript 一起使用，并且在新的 prop 上遇到错误sx。看一下下面 Typescript 显示的错误的屏幕截图。

有趣的是，我只在组件上收到此错误，TabPanel因为我在其他 MUI 组件上使用它时没有任何问题。下面是我的代码

/* eslint-disable react/require-default-props */
import * as React from 'react';
import Tabs from '@mui/material/Tabs';
import Tab from '@mui/material/Tab';
import Typography from '@mui/material/Typography';
import Box from '@mui/material/Box';

interface TabPanelProps {
  children?: React.ReactNode;
  index: number;
  value: number;
}

function TabPanel(props: TabPanelProps) {
  const { children, value, index, ...other } = props;

  return (
    <div
      role="tabpanel"
      hidden={value !== index}
      id={`simple-tabpanel-${index}`}
      aria-labelledby={`simple-tab-${index}`}
      {...other}
    >
      {value === index && …

我正在使用 redux 工具包查询来获取数据 API。问题是我遇到的是错误处理 redux 工具包从查询挂钩返回错误属性。因此，从服务器返回的错误是一个带有嵌套数据的对象，并且尝试访问它时，当尝试从错误对象访问数据时，我收到打字稿错误。

下面是我如何声明我的突变钩子

const [updateProgram, {
  isLoading: isUpdatingProgram,
  error: updateProgramError
}] = useUpdateProgramMutation();

下面是我尝试访问代码中的错误的方法。

onSubmit = {
  async(values, {
    setSubmitting
  }) => {
    await updateProgram({ ...values,
      id: 'programData.data._id'
    });
    refetch();

    if (updateProgramError) {
      enqueueSnackbar('Test message', {
        variant: 'error'
      });
      console.log(updateProgramError?.data?.message);
    }
    setSubmitting(false);
  }
}

现在我收到的打字稿错误如下。并不是说我能够 console.log(updateProgramError) 并且是控制台中的数据

Property 'data' does not exist on type 'FetchBaseQueryError | SerializedError'.
  Property 'data' does not exist on type 'SerializedError'.

{
  "status": 500,
  "data": {
    "status": "error",
    "message": …