react项目中遇到的错误

错误以及解决方案

  1. ./src/services/products.js Module not found: Can't resolve 'request' in 'C:\Users\Desktop\后台管理项目\dream\src\services'
    解决方案 进入后台管理项目这个文件然后在控制台输入npm install request

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! dream@0.1.0 start: `react-scripts start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the dream@0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.       
npm ERR! A complete log of this run can be found in

最好的解决方式就是将npm删掉然后在重新安装即可

  1. React Hook "useEffect" is called in function "addlevel" that is neither a React function component
    解决方式 将包含的函数名字开头字母大写喔不然会有歧义
  2. 遇到的问题:在加入ant组件实现增添功能时,我直接在提交按钮上绑定点击事件实现页面跳转,但是我的增添的数据却不能再显示页面刷新出来,发现此原因是因为代码同步运行然后运行到这发现直接调转,然后传输数据就直接断掉了。
    解决方案:我想到了异步操作,想了很多觉得有点过于复杂了,我就直接将提交按钮改成保存按钮,先让数据传输上去,然后我在写了一个返回按钮,返回到显示页面,然后我的新增数据就能显示了哈哈哈哈哈开心。
  3. Identifier 'React' has already been declared. (3:8)
    解决方法:找到这个错误所指示的文件然后讲按照提示改变这种情况下一般是导入包的重复,解决的时候要注意在哪个文件下去寻找不要找错 啊啊啊啊!
  4. axios连接超时的错误timeout of 5000ms exceeded
    解决方法:将下面的串代码替换掉就可以了
instance.interceptors.response.use(undefined, function axiosRetryInterceptor(err) {
    
    
    var config = err.config;
    // If config does not exist or the retry option is not set, reject
    if(!config || !config.retry) return Promise.reject(err);
    
    // Set the variable for keeping track of the retry count
    config.__retryCount = config.__retryCount || 0;
    
    // Check if we've maxed out the total number of retries
    if(config.__retryCount >= config.retry) {
    
    
        // Reject with the error
        return Promise.reject(err);
    }
    
    // Increase the retry count
    config.__retryCount += 1;
    
    // Create new promise to handle exponential backoff
    var backoff = new Promise(function(resolve) {
    
    
        setTimeout(function() {
    
    
            resolve();
        }, config.retryDelay || 1);
        config.headers["authorization"] = "Bearer"+getToken();//todo验证信息
        // return config;
    });
});

注意:设置这样的拦截器之后所有的数据不再是res.data中了而是在res.data.data中将要显示的数据都必须这么显示调用,不然使用ant组件会一直显示rowdata的错误因为数据格式显示错误datasource只能赋值给数组格式

  1. : Can't resolve 'antd-img-crop' in '
    问题解决方式:antd组件库中你的组件没有而导致的具体解决方案看点击以下链接
    解决方案
    知识点记忆 tab+shift

Guess you like

Origin blog.csdn.net/qq_47988584/article/details/119903672