Translating vanilla javascript plus node js to react and node js code [closed]
تبليغيرجى شرح بإيجاز لمإذا تشعر أنك ينبغي الإبلاغ عن هذا السؤال.
So basically I had a small app that consisted of a navbar with a dropdown menu (and multiple submenus) and when you clicked a button it would make a fetch request to a github repository and return all the files as buttons in another page, and if you cliqued any of those buttons it would return a json with information about that file.
I’m trying to recreate that app but using react on the client side instead while still using node for the backend, whoever I have no clue how I’m supposed to send the information about the button I cliqued from react to the backend in order for it to process and make the fetch request and return that result to the front end side. The button that get’s cliqued is supposed to have the path to find the files in github repository. As shown in the code below the path const get’s the value from a button from the navbar on the original html, I’m trying to get this same behavior but in react but I don’t know how.
Node code
app.post(“/”, function(req,res){
const url = “https://api.github.com/”
const getRepoContent = “repos/gestaopedidosehr/CKM-mirror/contents/”
const path = req.body.testar
console.log(path)
fetch(url + getRepoContent + path , {
headers: new Headers({
‘Accept’: ‘application/vnd.github.v3+json’,
‘Authorization’: ‘Bearer xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx’,
})
}).then(res => res.json() )
.then(json => {
for (var i = 0; i < json.length; i++){
var obj = json[i];
for (var key in obj){
if(key == “name”){
var value = obj[key];
res.write(‘<div> <form action = “/results” method = “post”>’ +
‘<button type = “submit” name = “testar2” value’ + ‘=’ + ‘”‘ + req.body.testar + value + ‘”‘ + ‘>’ + key + “: ” + value + ‘</form> </div>’);
}
}
}
res.send()
HTML snipet
<li class=”dropdown-submenu”><a class=”dropdown-item dropdown-toggle” href=”#”>Entry</a>
<ul class =”dropdown-menu”>
<form action = “/” method = “post”>
<li><button class=”dropdown-item” type = “submit” value = “local/templates/entry/evaluation/” name = “testar”>Evaluation</button></li>
<li><button class=”dropdown-item” type = “submit” value = “local/templates/entry/observation/” name = “testar”>Observation</button></li>
</form>
</ul>
</ul>
</li>
أضف إجابة