в процессе обучения делаю сайт - тудушку. вот код:
роуты экспресса:
var express = require('express');
var router = express.Router();
var bodyParser = require('body-parser');
const Task = require('../models/Task');
// return all tasks
router.get('/getTask', function(req, res) {
Task.find({}, function(error,data){
if(error){
console.log(error)
}
res.send(data)
})
})
//create new task
router.post('/newTask', function(req,res){
if(!req.body) return res.sendStatus(400);
var a = new Date();
var mydate = a.toLocaleString();
Task.create({
description:req.body.description,
task:req.body.task,
addDate: mydate
},
function(err){
if(err)
res.send(err);
})
res.send("Task has been created")
})
module.exports = router
элемент реакта для отображения полученной с бд информации:
import React from 'react'
import axios from "axios"
class LoadTask extends React.Component{
constructor(props) {
super(props);
this.state = {items:[],
key : 0,
};
}
async componentDidMount() {
try {axios.get('http://localhost:5000/api/getTask')
.then(response => this.setState({items: Object.values(response.data)}));}
catch ( error ) {
console.log(error)
};
}
render() {
return(
<div className="loadTaskWrap">
<p>Здесь ты можешь просмотреть существующие таски:</p>
<div className="desP">
<div>{this.state.items.map((item) =>
(<div key={item.description} className='styleTask' >
<p className="stDesk" >{item.description}:</p>
<div>{item.task}
</div>
<div>{item.addDate}</div>
<button>Удалить задачу</button>
<button>Отметить как выполненную</button>
</div>))}</div>
</div>
</div>
)
}
}
export default LoadTask
Меня настиг ступор - как в моем случае грамотно реализовать удаление моего таска по нажатию на кнопку "удалить задачу"? Заранее спасибо!
Простой
