Reactjs 使用无服务器函数通过Mongoose在MongoDB数据库中查找DBYID，并以React形式呈现结果-不工作

我已经构建了一个“编辑”页面，试图通过在Vercel托管的无服务器函数中使用“findById”来提取MongoDB数据库中的单个对象

然后，我尝试使用响应数据填充此“编辑”页面上不同输入的“值”

但是，我的调用没有收到任何响应（甚至没有错误消息，无论是在我的控制台中还是在Vercel上的函数日志中）-页面加载成功，但没有数据输入，它们以空白形式通过。我已经为响应添加了一个控制台日志，其详细信息在下面的编辑中

值得注意的是，URL是所调用对象的MongoDB ID

我尝试过重构我的代码，寻找解决方案，阅读教程，但似乎没有任何效果。这是令人沮丧的，因为我只是没有从我的应用程序中得到任何反馈，所以不知道我做错了什么

如果有人对我的代码有任何反馈，我们将不胜感激。如果我遗漏了下面的内容，请告诉我

“子”和“父”组件正是页面导航到的方式

我通过React路由器的“路线”：

<Route path="/edit/:id" component={EditDebt} />

我的“孩子”组件，它使用道具使用响应MongoDB ID填充链接

<div className="debt-card-edit-container"><a className="debt-card-edit-link" href={`/edit/${props.edit}`}>Edit</a></div>

最后，也是最重要的，我实际的“编辑”组件完整

    class EditDebt extends Component {
      constructor(props) {
        super(props)
    
        this.state = {
          provider: '',
          balance: '',
          limit: '',
          monthly: '',
          interest: '',
          borrowed: ''
        }
    
        this.onChange = this.onChange.bind(this);
      }
    
       componentDidMount() {
        axios.get("/api/fetchEditDebt")
          .then(response => {
            this.setState({
              provider: response.data.provider,
              balance: response.data.balance,
              limit: response.data.limit,
              monthly: response.data.monthly,
              interest: response.data.interest,
              borrowed: response.data.borrowed
            })
            console.log(res)
            console.log(this.state.provider)
          })
          .catch(function (error) {
            console.log(error)
          })
      }
    
      onChange = (e) => {
            this.setState({ [e.target.name]: e.target.value})
        }
    
      render() {
    
        return (
          <section className="edit-debt-section">
            <div className="edit-debt-container">

    
<input type="text" value={this.state.provider} onChange=.  {this.onChange} />


            </div>
          </section>
        )
      }
    }

类EditDebt扩展组件{ 建造师（道具）{ 超级（道具） 此.state={ 提供程序：“”， 余额：''， 限制：“”， 每月：''， 利息：''， 借用：“” } this.onChange=this.onChange.bind（this）； } componentDidMount（）{ get（“/api/fetchEditDebt”） 。然后（响应=>{ 这是我的国家({ 提供者：response.data.provider， 平衡：response.data.balance， 限制：response.data.limit， 每月：response.data.monthly， 兴趣：response.data.interest， 借用：response.data.followed }) console.log（res） console.log（this.state.provider） }) .catch（函数（错误）{ console.log（错误） }) } onChange=（e）=>{ this.setState（{[e.target.name]：e.target.value}） } render（）{ 返回( ) } } 对不起，所有的代码，请让我知道，如果我错过了什么，这是真正重要的我的问题

多谢各位

编辑：我已删除“this.props.match.params.id”并尝试重新运行我的代码。。现在，我的后端出现以下错误：

2020-10-23T14:55:25.984Z    71f7b650-1a7d-42c2-953e-ff17edc22cb5    ERROR   Unhandled Promise Rejection     {"errorType":"Runtime.UnhandledPromiseRejection","errorMessage":"TypeError: Cannot read property 'id' of undefined","reason":{"errorType":"TypeError","errorMessage":"Cannot read property 'id' of undefined","stack":["TypeError: Cannot read property 'id' of undefined","    at module.exports (/var/task/api/fetchEditDebt.js:12:23)","    at Server.<anonymous> (/var/task/___now_helpers.js:813:19)","    at Server.emit (events.js:315:20)","    at parserOnIncoming (_http_server.js:790:12)","    at HTTPParser.parserOnHeadersComplete (_http_common.js:119:17)"]},"promise":{},"stack":["Runtime.UnhandledPromiseRejection: TypeError: Cannot read property 'id' of undefined","    at process.<anonymous> (/var/runtime/index.js:35:15)","    at process.emit (events.js:327:22)","    at processPromiseRejections (internal/process/promises.js:209:33)","    at processTicksAndRejections (internal/process/task_queues.js:98:32)"]}
Unknown application error occurred

2020-10-23T14:55:25.984Z 71f7b650-1a7d-42c2-953e-ff17edc22cb5错误未经处理的承诺拒绝{“errorType”：“Runtime.UnhandledPromiseRejection”，“errorMessage”：“TypeError:无法读取未定义的属性“id”，“reason”：{“errorType”：“TypeError”，“errorMessage”：“无法读取未定义的属性“id”，“堆栈”：”[“TypeError:无法读取未定义的属性'id'”、“at module.exports（/var/task/api/fetchEditDebt.js:12:23）”、“at Server.（/var/task/uuuuuuuuuuuu now_helpers.js:813:19）”、“at Server.emit（events.js:315:20）”、“at parserOnIncoming（http_userver.js:790:12）”、“at HTTPParser.parseronheadcomplete（http_ucommon.js:119:17）”，“promise:{}，”堆栈“：[“Runtime.UnhandledPromiseRejection:TypeError:无法读取未定义的属性'id'”、“at process.（/var/Runtime/index.js:35:15）”、“at process.emit（events.js:327:22）”、“at processPromiseRejections（internal/process/promises.js:209:33）”、“at processTicksAndRejections（internal/process/task\u queues.js:98:32）”]
发生未知的应用程序错误

是否可以在您的请求url上添加一个额外的“/”

---

axios.get（“/api/fetchEditDebt/”+this.props.match.params.id）

用此替换您的axios api代码

axios.get("/api/fetchEditDebt", { params: { id: this.props.match.params.id }})
      .then(response => {
        this.setState({
          provider: response.data.provider,
          balance: response.data.balance,
          limit: response.data.limit,
          monthly: response.data.monthly,
          interest: response.data.interest,
          borrowed: response.data.borrowed
        })
        console.log(res)
        console.log(this.state.provider)
      })
      .catch(function (error) {
        console.log(error)
      })

---

试过了，运气不好。我正在用几个控制台日志的输出更新我的原始问题。你能确保你能连接到mongoDB吗？你也能记录什么是响应。我上面看到的代码是loggin res对象而不是响应。嗨-我可以在我的mongoDB应用程序的其他函数中使用这个精确设置进行连接，所以没有问题这里！你能澄清一下到底是什么控制台日志吗？我已经用console.log（response）和console.log（res）试过了，每次都有相同的输出。干杯。你能扩展响应上的数据对象吗？我不确定你应该接收到的是不是这个，这个问题可能是在事情的后端。数据对象没有扩展！这很奇怪。我相信我在其他地方进行的其他数据库调用也会扩展，所以我认为你是对的-这是se（我想）问题所在的无服务器函数。嘿，谢谢你。我刚才解决了它，但这基本上就是我使用的解决方案。谢谢你的帮助。

    class EditDebt extends Component {
      constructor(props) {
        super(props)
    
        this.state = {
          provider: '',
          balance: '',
          limit: '',
          monthly: '',
          interest: '',
          borrowed: ''
        }
    
        this.onChange = this.onChange.bind(this);
      }
    
       componentDidMount() {
        axios.get("/api/fetchEditDebt")
          .then(response => {
            this.setState({
              provider: response.data.provider,
              balance: response.data.balance,
              limit: response.data.limit,
              monthly: response.data.monthly,
              interest: response.data.interest,
              borrowed: response.data.borrowed
            })
            console.log(res)
            console.log(this.state.provider)
          })
          .catch(function (error) {
            console.log(error)
          })
      }
    
      onChange = (e) => {
            this.setState({ [e.target.name]: e.target.value})
        }
    
      render() {
    
        return (
          <section className="edit-debt-section">
            <div className="edit-debt-container">

    
<input type="text" value={this.state.provider} onChange=.  {this.onChange} />


            </div>
          </section>
        )
      }
    }

2020-10-23T14:55:25.984Z    71f7b650-1a7d-42c2-953e-ff17edc22cb5    ERROR   Unhandled Promise Rejection     {"errorType":"Runtime.UnhandledPromiseRejection","errorMessage":"TypeError: Cannot read property 'id' of undefined","reason":{"errorType":"TypeError","errorMessage":"Cannot read property 'id' of undefined","stack":["TypeError: Cannot read property 'id' of undefined","    at module.exports (/var/task/api/fetchEditDebt.js:12:23)","    at Server.<anonymous> (/var/task/___now_helpers.js:813:19)","    at Server.emit (events.js:315:20)","    at parserOnIncoming (_http_server.js:790:12)","    at HTTPParser.parserOnHeadersComplete (_http_common.js:119:17)"]},"promise":{},"stack":["Runtime.UnhandledPromiseRejection: TypeError: Cannot read property 'id' of undefined","    at process.<anonymous> (/var/runtime/index.js:35:15)","    at process.emit (events.js:327:22)","    at processPromiseRejections (internal/process/promises.js:209:33)","    at processTicksAndRejections (internal/process/task_queues.js:98:32)"]}
Unknown application error occurred

axios.get("/api/fetchEditDebt", { params: { id: this.props.match.params.id }})
      .then(response => {
        this.setState({
          provider: response.data.provider,
          balance: response.data.balance,
          limit: response.data.limit,
          monthly: response.data.monthly,
          interest: response.data.interest,
          borrowed: response.data.borrowed
        })
        console.log(res)
        console.log(this.state.provider)
      })
      .catch(function (error) {
        console.log(error)
      })