0

我有一个从 APIresolveMovieSessions接收movieSessions并根据 API 结果创建新数据集合的方法。

我想要实现的是从这里转换 API 数据:

{
  "data": {
    "movieSessions": [
      {
        "startsIn": "2019-04-12 10:30:00",
        "movieTheaterRoom": {
          "name": "Sala 1"
        }
      },
      {
        "startsIn": "2019-04-13 10:30:00",
        "movieTheaterRoom": {
          "name": "Sala 1"{
}
        }
      },
      {
        "startsIn": "2019-04-14 10:30:00",
        "movieTheaterRoom": {
          "name": "Sala 1"
        }
      },
      {
        "startsIn": "2019-04-15 10:30:00",
        "movieTheaterRoom": {
          "name": "Sala 1"
        }
      },
      {
        "startsIn": "2019-04-16 10:30:00",
        "movieTheaterRoom": {
          "name": "Sala 1"
        }
      },
      {
        "startsIn": "2019-04-17 10:30:00",
        "movieTheaterRoom": {
          "name": "Sala 1"
        }
      },
      {
        "startsIn": "2019-04-11 10:30:00",
        "movieTheaterRoom": {
          "name": "Sala 2"
        }
      },
      {
        "startsIn": "2019-04-12 10:30:00",
        "movieTheaterRoom": {
          "name": "Sala 2"
        }
      },
      {
        "startsIn": "2019-04-13 10:30:00",
        "movieTheaterRoom": {
          "name": "Sala 2"
        }
      },
      {
        "startsIn": "2019-04-14 10:30:00",
        "movieTheaterRoom": {{
}
          "name": "Sala 2"
        }
      },
      {
        "startsIn": "2019-04-15 10:30:00",
        "movieTheaterRoom": {
          "name": "Sala 2"
        }
      },
      {
        "startsIn": "2019-04-16 10:30:00",
        "movieTheaterRoom": {
          "name": "Sala 2"
        }
      }
    ]
  }
}

对此:

{
  "2019-04-12": [{
    "room": "Sala 1",
    "hour": "10:30:00"
  }, {
    "room": "Sala 2",
    "hour": "10:30:00"
  }],
  "2019-04-13": [{
    "room": "Sala 1",
    "hour": "10:30:00"
  }, {
    "room": "Sala 2",
    "hour": "10:30:00"
  }],
  "2019-04-14": [{
    "room": "Sala 1",
    "hour": "10:30:00"
  }, {
    "room": "Sala 2",
    "hour": "10:30:00"
  }],
  "2019-04-15": [{
    "room": "Sala 1",
    "hour": "10:30:00"
  }, {
    "room": "Sala 2",
    "hour": "10:30:00"
  }],
  "2019-04-16": [{
    "room": "Sala 1",
    "hour": "10:30:00"
  }, {
    "room": "Sala 2",
    "hour": "10:30:00"
  }],
  "2019-04-17": [{
    "room": "Sala 1",
    "hour": "10:30:00"
  }],
  "2019-04-11": [{
    "room": "Sala 2",
    "hour": "10:30:00"
  }]
}

为此,我编写了以下代码:

export default {
  data() {
    return {
      movieSessions: null
    }
  },
  methods: {
    resolveMovieSessions(movieSessions) {
      const data = []

      if (movieSessions) {
        movieSessions.forEach((session) => {
          const startsInParts = session.startsIn.split(' ')

          const sessionDate = startsInParts[0]
          const sessionTime = startsInParts[1]

          if (!data.hasOwnProperty(sessionDate)) {
            this.$set(data, sessionDate, [])
          }

          data[sessionDate].push({
            room: session.movieTheaterRoom.name,
            time: sessionTime
          })
        })
      }

      return data
    },
    async loadMovieSessions() {
      const movieSessionsQuery = await apollo.query({
        query: MOVIE_SESSIONS_QUERY,
        variables: {
          movieId: this.movie.id,
          movieTheaterId: this.movieTheaterId
        }
      })

      const { data } = movieSessionsQuery
      const { movieSessions } = data

      this.movieSessions = this.resolveMovieSessions(movieSessions)
    }
  }
}

但是当this.resolveMovieSessions(movieSessions)被调用时,结果是dataconst的初始值const data = []

但是在方法内部,如果我放了一个,console.log(data)那么我会得到一个新的集合,但是一个非反应性的集合。

怎么了?

4

1 回答 1

0

问题是dataconst 实际上是一个数组而不是一个对象:const data = [],我不知道为什么,但这就是问题的原因。

这是工作代码:

methods: {
  resolveMovieSessions(movieSessions) {
    const data = {}

    if (movieSessions) {
      movieSessions.forEach((session) => {
        const startsInParts = session.startsIn.split(' ')

        const sessionDate = startsInParts[0]
        const sessionHour = startsInParts[1]

        if (!data.hasOwnProperty(sessionDate)) {
          data[sessionDate] = []
        }

        data[sessionDate].push({
          room: session.movieTheaterRoom.name,
          hour: sessionHour
        })
      })
    }

    return data
  }
}
于 2019-04-11T21:13:21.240 回答