react项目实战学习笔记-学习46-发送请求

请求拦截器

// 添加请求拦截器
instance.interceptors.request.use(function (config) {
  let token = localStorage.getItem('cms-token')
  if(token){
    config.headers = {
      'cms-token': token
    }
  }
  return config;
}, function (error) {
  // 对请求错误做些什么
  return Promise.reject(error);
});

// 添加响应拦截器
instance.interceptors.response.use(function (response) {
  // 对响应数据做点什么
  return response.data;
}, function (error) {
  // 对响应错误做点什么
  return Promise.reject(error);
});

export default instance;
 // 处理请求数据
  const dealData = (errCode, msg) => {
    setIsModalVisible(false); // 关闭对话框
    if (errCode === 0) {
      message.success(msg)
      setTimeout(() => {
        // 跳回list页面
        navigate('/listlist')
      }, 1500)
    } else {
      message.error(msg)
    }
  }
  // 对话框点击了提交
  const handleOk = () => {
    form
      .validateFields()    // validate校验   field字段
      .then((values) => {
        //  form.resetFields();   // reset重置
        let { title, subTitle } = values;
        // 地址栏有id代表现在想要更新一篇文章
        if (params.id) {
          // 更新文章的请求
          ArticleUpdateApi({ title, subTitle, content, id: params.id }).then(res => dealData(res.errCode, res.message))
        } else {
          // 添加文章的请求
          ArticleAddApi({ title, subTitle, content }).then(res => dealData(res.errCode, res.message))
        }
      })
      .catch(() => false);
  };

posted @ 2022-08-26 20:35  前端导师歌谣  阅读(34)  评论(0)    收藏  举报