API에서 100개의 밈을 가져오는 페이지가 있습니다. 밈을 테이블에 표시하고, 각 밈에는 사용자를 밈의 세부정보 페이지로 안내하는 세부정보 버튼이 있습니다. meme 경로에 대한 POST 요청을 수행하고 meme 세부정보 페이지를 렌더링해야 합니다. 게시물 요청이 성공했지만 밈 페이지가 router.post의 render()에서 렌더링되지 않습니다.
Meme.js
으아악memes.egs 버튼:
으아악MemeDetails.js:
으아악터미널의 응답은 POST /meme 200 10.677 ms - 2703이지만 페이지에는 아무것도 렌더링되지 않습니다.
P粉7187309562023-09-09 16:21:06
먼저 "하지만 페이지에는 아무것도 렌더링되지 않습니다"라고 언급하고 싶습니다.
페이지를 자동 렌더링하지 않습니다. MDN Webdocs에서 fetch()
用于使用 AJAX 调用从网络获取资源。您获取的资源将存储在 response
변수에서 얻은 데이터를 수동으로 처리해야 한다고 지적했기 때문입니다(DOM insideText를 조작하거나 window를 사용하여 다른 페이지로 리디렉션). href.location < /代码>)
그러나 POST 요청은 일반적으로 서버에서 데이터를 생성/수정하는 데 사용됩니다(HTTP 메서드를 읽어보세요). 페이지를 렌더링하거나 다른 페이지로 이동하기 위해 POST 요청을 사용하고 계십니다. GET은 서버에서 데이터를 요청하는 데 사용되는 HTTP 메서드입니다.
handleDetailsClick
的方式。您可以使用 或者简单地修改
元素的
onclick
行为,使其具有 window.location.href=".../meme?id= <%= meme.id %>"
handleDetailsClick 처리 방식을 바꾸는 것이 좋을 것 같습니다. 전체 meme 데이터를 전달하는 대신
window.location.href=".../meme?id= <%= meme 을 갖도록 요소의 onclick 동작을 수정하세요. 아이디 %>"
그런 다음 Express 측에서 POST 경로를 GET으로 수정하고 쿼리 문자열에서 특정 ID를 가져올 수 있으므로 데이터베이스 등에서 검색하고
으아악 도움이 되길 바랍니다
res.render ()
要渲染 html 页面,您只需使用 res.JSON()
업데이트
res.render()를 사용하는 대신 위의 POST 라우팅 코드를 약간 수정할 수 있습니다(배포 요구 사항에 따라 ID만 사용하거나 전체 데이터를 사용할 수 있음). HTML 페이지를 렌더링하려면
res.JSON()을 사용하고 JS를 사용하여JSON