JavaScript过滤器在我的nuext应用程序中不能正常工作

Question

我有一个从API获得的对象数组，我想根据_id字段过滤掉其中一个。问题是，它没有过滤掉具有相同_id的那个，而是过滤掉了所有的东西。

下面是我的代码——我也console.log每一步，所以我们可以看到发生了什么

我的NUXTJS方法

        removeSingleImage(imageObjId) {
            this.$axios.delete(`/photo/${imageObjId}`)
            .then(result => {
                const olduploaded = this.uploaded
                console.log(olduploaded);
                const newUploaded = olduploaded.filter((item) => {
                    console.log("item._id", item._id);
                    console.log("imageObjId", imageObjId);
                    item._id !== imageObjId
                })
                this.uploaded = newUploaded
                console.log(newUploaded);
            })
            .catch(e => {
                console.log(e);
            })
        }

当这个代码console.log(olduploaded);运行时，在控制台中我得到预期的数组，如下所示

[
                {
                    "_id":"60de4a29e2c2850015c4dd78",
                    "location":"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSuIbd-D80_YPHKNJnLFuO2bHqk5NfNIna7ZQ&usqp=CAU",
                    "owner":"60dce43551e7df0015bd0b65",
                    "place":"60de48e3e2c2850015c4dd75",
                    "createdAt":"2021-07-01T23:05:13.264Z",
                    "updatedAt":"2021-07-01T23:05:13.264Z",
                    "__v":0},
                {
                    "_id":"60e3ad33804ed4001542ad7b",
                    "location":"https://images.unsplash.com/photo-1472224371017-08207f84aaae?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1050&q=80",
                    "owner":"60dce43551e7df0015bd0b65",
                    "place":"60de48e3e2c2850015c4dd75",
                    "createdAt":"2021-07-06T01:09:07.716Z",
                    "updatedAt":"2021-07-06T01:09:07.716Z",
                    "__v":0},
                {
                    "_id":"60faa55763da2f0015c19941","key":"photos/QtIQk0WanlWsaeB8w6agYSaHKnUuUb.webp",
                    "location":"https://lookaam.s3-eu-west-2.amazonaws.com/photos/QtIQk0WanlWsaeB8w6agYSaHKnUuUb.webp",
                    "owner":"60dce43551e7df0015bd0b65",
                    "place":"60de48e3e2c2850015c4dd75",
                    "createdAt":"2021-07-23T11:17:43.359Z",
                    "updatedAt":"2021-07-23T11:17:43.359Z",
                    "__v":0},
                {
                    "_id":"60faa55863da2f0015c19942","key":"photos/MnacW4UFUWa0kyVjOX5cPBZxYBGLCs.webp",
                    "location":"https://lookaam.s3-eu-west-2.amazonaws.com/photos/MnacW4UFUWa0kyVjOX5cPBZxYBGLCs.webp",
                    "owner":"60dce43551e7df0015bd0b65",
                    "place":"60de48e3e2c2850015c4dd75",
                    "createdAt":"2021-07-23T11:17:44.005Z",
                    "updatedAt":"2021-07-23T11:17:44.005Z",
                    "__v":0}
]

为每个项目输入console.log("item._id", item._id);和console.log("imageObjId", imageObjId);时，得到

item._id 60de4a29e2c2850015c4dd78
imageObjId 60faa55863da2f0015c19942
item._id 60e3ad33804ed4001542ad7b
imageObjId 60faa55863da2f0015c19942
item._id 60faa55763da2f0015c19941
imageObjId 60faa55863da2f0015c19942
item._id 60faa55863da2f0015c19942
imageObjId 60faa55863da2f0015c19942

，我们可以看到最后的item._id和imageObjId是相同的，应该被过滤掉，但是当我过滤它们并运行console.log(newUploaded)时，我得到的是一个空数组

[]

Answer 1

您错过了过滤器回调中的return:

            const newUploaded = olduploaded.filter((item) => {
                console.log("item._id", item._id);
                console.log("imageObjId", imageObjId);
                return item._id !== imageObjId
                //🔺
            })