react axios获取数据显示图片报 http 431错误

axios部分

    let id = this.props.match.params.id;
    axios.get(`https://5f3b67bbfff8550016ae5344.mockapi.io/api/v1/list?id=${id}`)
        .then((res)=>{                             
            this.setState({
                list:res.data
            })
            console.log(this.state.list)
        })
        .catch(function(error){
            console.error();
        })
}

显示数据部分

                    {
                        this.state.list.map((value,key)=>{                                     
                                    return  <div key = {key}>                                                     
                                                    <img src = {value.pic} />
                                                </div>
                                            </div>    
                        })
                    }

F12下能看到list里有取到的数据，图片无法显示
报HTTP431错误 GET - http://localhost:3000/detail/img/pinguo.jpg

https://www.jianshu.com/p/309045c127c7