Блог

Я искал довольно долго, но, будучи новичком, я не могу найти ответ. Я хотел бы отфильтровать свой массив с идентификатором свойства, которое, по моему мнению, является неправильным синтаксисом. Спасибо за вашу помощь

Компоненты

 export default {
  props: ["user", "recette"],
  data() {
    return { email: this.$route.params.email };
  },
  components: {},
  methods: {},
  computed: {
    filteredItems: function () {
      return this.recette.filter((recettes) => {
        return recettes.cat_recetteId === 1;
      });
    },
  },
};
 

Вид

 <template>
  <div>
    <myrecette :recette="recette"/>
    <myfooter />
  </div>
</template>

<script>
import myrecette from "../components/recette";
import myfooter from "../components/myfooter";

export default {
  name: "",
  data() {
    return {
      recette: "",
      user: "",
    };
  },
  components: {
    myrecette,
    myfooter,
  },
  created: function() {
    this.axios.get("http://localhost:3000/recette/all_recette/").then((res) => {
      (this.recette = res.data.recette),
        this.axios
          .get(
            "http://localhost:3000/user/rec_user/"   this.$route.params.email
          )
          .then((res) => {
            this.user = res.data.user;
          });
    });
  },
};
</script>
<style scoped></style>
 

УЗЕЛ

 router.get("/all_recette", (req, res) => {
    db.recette
        .findAll({
            include: { all: true },
        })
        .then((recette) => {
            if (recette) {
                res.status(200).json({
                    recette: recette,
                });
            } else {
                res.json("il n'y a pas de recettes");

            }
        })
        .catch(err => {
            res.json(err);
        });
});
 

Вот мой полный код, а также маршрут моего узла.

Мой возврат ошибки

vue.runtime.esm.js?2b0e:619 [Предупреждение Vue]: ошибка при рендеринге: «Ошибка типа: this.recette.фильтр не является функцией»

Фильтр работает, сохраняя элементы, которые возвращаются true , поэтому, если вы хотите, чтобы все элементы имели cat_recetteId значение 1, вы бы изменили его на:

 computed: {
  filteredItems: function() {
    if (!this.recette) return [];
    return this.recette.filter((recettes) => {
      return recettes.cat_recetteId === 1;
    });
  },
},
 

Также рекомендуется использовать функцию со стрелкой в большинстве случаев внутри вычисляемого.

Ваша функция обратного вызова фильтра должна возвращать true или false . Вы 1) ничего не возвращаете и 2) присваиваете значение (=) вместо того, чтобы выполнять сравнение (==/===).

 computed: {
    filteredItems: function() {
      return this.recette.filter(function(recettes) {
        return recettes.cat_recetteId === 1;
      });
    },
  },