javascript - array.filter 在 vue3 中返回空数组

删除后我有一个简单的过滤操作,由于某种原因返回一个空数组。 values 被正确评估,但 allSheep 引用在操作完成后被重新分配给一个空数组。我不确定为什么会这样。这是我的设置功能

setup() {
    const allSheep = ref([]);
    const formOpen = ref(false);
    const searchQuery = ref("");
    const searchTag = ref("tag_id");
    const axios = inject("axios");
    axios
      .post(GRAPHQL_API_URL, {
        query: print(ALL_SHEEP),
      })
      .then((response) => {
        allSheep.value = response.data.data.get_all_sheep;
      })
      .catch((err) => console.log(err));

    const filteredSheep = computed(function () {
      const query = searchQuery.value.toLowerCase();
      return searchTag.value === "breed"
        ? allSheep.value.filter((el) => el.breed.breed_name.includes(query))
        : allSheep.value.filter((el) =>
            el[searchTag.value].toLowerCase().includes(query)
          );
    });

    function getSearchQuery(query) {
      searchQuery.value = query;
    }

    function setTag(key) {
      searchTag.value = key === "tag" ? (key = "tag_id") : key;
      searchQuery.value = "";
    }

    function handleOpenForm() {
      formOpen.value = true;
    }
    function updateData(data) {
      allSheep.value = [...allSheep.value, data];
    }

    function deleteSheep(id) {
      allSheep.value = allSheep.value.filter((el) => {
        el.sheep_id !== id;
      });
    }

    return {
      allSheep: filteredSheep,
      getSearchQuery,
      setTag,
      handleOpenForm,
      updateData,
      formOpen,
      searchQuery,
      searchTag,
      deleteSheep,
    };
  },
};
</script>

回答1

我需要做的就是用括号替换花括号:

function deleteSheep(id) {
          allSheep.value = allSheep.value.filter((el) => (
            el.sheep_id !== id;
          )
         );
        }

相似文章

php - 挣扎于数组 php 中的索引

从rapidapi获取json数据并尝试将其放入canvasjs图表中。我相信为什么我的图表不打印的问题是因为我创建的数组没有正确的索引。我的数组在所需的每个元素上都有索引0,它的索引为0-13。<!...

最新文章