小编dar*_*dka的帖子

我使用material-ui (v5) 和formik 的自动完成字段来生成我的表单。在这个表单上，我有一些定义为常量的列表。

我使用 api 来获取此列表的默认值。此 api 仅返回选项的“代码”，而不返回其标签。

<Formik
        enableReinitialize
        initialValues={initialFormValues}
        validationSchema={Yup.object().shape({
[...]
<Autocomplete
  error={Boolean(touched.civility && errors.civility)}
  helperText={touched.civility && errors.civility}
  label="Civility"
  margin="normal"
  name="civility"
  onBlur={handleBlur}
  onChange={(e, value) => setFieldValue('civility', value)}
  options={civilities}
  value={values.civility}
  getOptionLabel={(option) =>
    option.name ? option.name : ''
  }
  isOptionEqualToValue={(option, value) => option.code === value}
  renderInput={(params) => (
    <TextField
      {...params}
      variant="outlined"
      label={<Trans>Civility</Trans>}
    />
  )}
/>

我的参数 isOptionEqualToValue 很好，因为即使该值没有显示在输入中，它也可以在列表中很好地选择。

您可以看到输入文本字段为空：

但是如果我展开列表，我可以看到我的“ms”值已被选择：

我应该怎么做才能使输入文本包含默认值？

通常我使用 Django 和 React 制作应用程序，使用 JWT 进行身份验证。我正在测试nextJS。我无法管理 JWT 身份验证，因为我无法访问本地存储来获取我的 2 个令牌（访问+刷新）。

在 React 中，我使用 axios.js：

import axios from 'axios';
import { baseURL } from './const/urls';

const axiosInstance = axios.create({
  baseURL: baseURL,
  timeout: 5000,
  headers: {
    Authorization: localStorage.getItem('access_token')
      ? 'JWT ' + localStorage.getItem('access_token')
      : null,
    'Content-Type': 'application/json',
    accept: 'application/json',
    'Cache-Control': 'no-cache',
    Pragma: 'no-cache',
    Expires: '0'
  }
});

axiosInstance.interceptors.response.use(
  (response) => response,
  (error) => {
    const originalRequest = error.config;

    // Prevent infinite loops
    if (
      error.response.status === 401 &&
      originalRequest.url === '/token/refresh/' …