Vue.js：使用此参数。计算函数中的数据中的$route.params.id

目前，我有以下代码：

computed: {
    filteredMovies: function () {
      return this.movies.filter(movie => movie.director.id === 1);
    },
  },

相反，我试图在computed函数中使用

this.$route.params.id

from data，如下所示：

computed: {
    filteredMovies: function () {
      return this.movies.filter(movie => movie.director.id === this.$route.params.id);
    },
  },

我没有收到任何错误，但我收到的是空电影列表(

---

我如何才能做到这一点？非常感谢！

您可以通过在路线定义中设置“props:true”将id作为道具传递 例：

然后在您的组件中，只需添加id道具并使用它：

  props: {
    id: {
      type: Number,
      default: 0,
    },
  },
  computed: {
    filteredMovies() {
      return this.movies.filter(movie => movie.director.id === this.id);
    },
  },

---

通过在路线定义中设置“props:true”，可以将id作为道具传递 例：

然后在您的组件中，只需添加id道具并使用它：

  props: {
    id: {
      type: Number,
      default: 0,
    },
  },
  computed: {
    filteredMovies() {
      return this.movies.filter(movie => movie.director.id === this.id);
    },
  },

arrow函数中的作用域可能使其未定义

---

arrow函数中的作用域可能会使其未定义

将directorId作为计算属性，并传递该属性而不是此属性。$route.params.id __directorId（）{返回此属性。$route.params.id}在返回语句之前，您可以尝试打印'this.$route.params.id'并查看它是否包含值如果是，请检查它是一个数字还是一个字符，并让我知道是的，这是有效的。我可以在返回语句之前打印它。它是一个数字。您可以指定如何调整函数吗？非常感谢！将directorId作为正确的计算对象ty并传递它，而不是此。$route.params.id__;directorId（）{返回此。$route.params.id}在返回语句之前，您可以尝试打印“this.$route.params.id”并查看它是否包含值如果是，请检查它是数字还是字符，然后告诉我是的，可以。我可以在返回语句之前打印它。它是一个数字。您可以指定如何调整函数吗？非常感谢！

  props: {
    id: {
      type: Number,
      default: 0,
    },
  },
  computed: {
    filteredMovies() {
      return this.movies.filter(movie => movie.director.id === this.id);
    },
  },

computed: {
    filteredMovies: function () {
      var self = this
      return this.movies.filter(movie => movie.director.id === self.$route.params.id);
    },
  }