排序，使用React删除多行

Question

I'm using React with a Postgres DB with Sequelize. within my project, I have a promise that is "suppose" to delete all songs relating to the album, using the the Album.id in my state.

** Instead of deleting the rows of songs relating to the Album, after the delete request in the database, it removes the value of the AlbumId of the song. **

Is there an update I am missing

When I console.log outside of the service and in the promise this.state.Album.id remains the same. It hit's the server with the appropriate number.

This is the function within the React Component DeleteAlbum (e) { e.preventDefault()

    axios.delete(`${domain}/albums/${this.state.Album.id}`)
    .then((res) => {
      axios.delete(`${domain}/songs/ByAlbumId/${this.state.Album.id}`)
      .then((res) => {
        window.location.href = '/#/'
      })
      .catch((error) => {
        console.log('axios error', error)
      })
    })
    .catch((error) => {
      console.log('axios error', error)
    })
  }

This is the Database to the Songs Route

const express = require('express')
const router = express.Router()
const bodyParser = require('body-parser')
const db = require('./../models')
const Song = db.Song

router.use(bodyParser.json({ extended: false }))

const exists = (req) => {
  if (typeof parseInt(req.params.id) === 'number') {
    Album.findOne({
      where: {
        id: req.params.id
      }
    })
    .then((album) => {
      if (album) {
        return true
      };
      return false
    })
    .catch((err) => {
      return false
    })
  } else {
    return false
  }
}

router.delete('/ByAlbumId/:id', function (req, res) {
  Song.destroy({
    where: {
      AlbumId: req.params.id
    }
  })
  .then(function (data) {
    return res.json(data)
  })
  .catch(function (err) {
    return res.json({ error: err})
  })
})

router.delete('/:id', function (req, res) {
  if (exists) {
    Song.destroy({
      where: {
        id: req.params.id
      }
    })
    .then(function (data) {
      return res.json(data)
    })
    .catch(function (err) {
      return res.json({ error: err})
    })
  } else {
    res.json({success: false})
  }
})

This is the Album Route

const express = require('express')
const router = express.Router()
const bodyParser = require('body-parser')
const db = require('./../models')
const Album = db.Album

router.use(bodyParser.json({ extended: false }))

const exists = (req) => {
  if (typeof parseInt(req.params.id) === 'number') {
    Album.findOne({
      where: {
        id: req.params.id
      }
    })
    .then((album) => {
      if (album) {
        return true
      };
      return false
    })
    .catch((err) => {
      return false
    })
  } else {
    return false
  }
}

router.delete('/:id', function (req, res) {
  if (exists) {
    Album.destroy({
      where: {
        id: req.params.id
      }
    })
    .then(function (data) {
      return res.json(data)
    })
    .catch(function (err) {
      return res.json({ error: err})
    })
  } else {
    res.json({success: false})
  }
})

If I place console logs all over the place, the output is what I expect it to be. There's is just something going wrong with Deleting two songs from my app. I can delete multiple songs if I hit the server directly with postman

Any idea?

Answer 1

You are actually destroying the album, before you destroy the songs.

In this case, since they probably have onDelete: 'SET NULL' option added, you will just de-associate the songs with that album.

Your fix will be to just replace the order of your calls :

 // First we delete the songs and then the album
 axios.delete(`${domain}/songs/ByAlbumId/${this.state.Album.id}`)
     .then((res) => {
         axios.delete(`${domain}/albums/${this.state.Album.id}`)
            .then((res) => {