结果 Vue GraphQL 上缺少电影属性 [英] Missing movies attribute on result Vue GraphQL
问题描述
我是前端开发人员，所以第一次接触 vue 和 graphql，我不知道如何处理这个错误:
结果 {movies: Array(20)} 上缺少 getMovies 属性这是我的代码，我可以看到在 chrome 中开发工具的响应中成功获取了数据:
{"data":{"movies":[{"__typename":"Movie","id":11,"overview":代码如下:
<div class="你好"><ul><li v-for="电影中的电影" :key="movie.id">{{movie.title}}</li><脚本>从'graphql-tag'导入gql导出默认{name: 'HelloWorld',数据(){返回 {电影: []}},阿波罗:{获取电影:{查询:gql`查询星球大战{电影(查询:星球大战"){标题概述海报路径ID}}`，结果({数据}){this.movies = 数据.movies}}},道具: {消息:字符串}}
Per 这个问题，你的 apollo 属性应该有一个匹配的 data 属性，但在这种情况下它们不匹配(一个名为 movies 和 <代码>获取电影).更改其中之一:
出口默认{name: 'HelloWorld',数据(){返回 {电影: []}},阿波罗:{电影: {查询:gql`查询星球大战{电影(查询:星球大战"){标题概述海报路径ID}}`}},道具: {消息:字符串}}不需要在 result 中自己设置 data.
I am frontend developer so for the first time I got my hands on vue and graphql, I don’t know how exactly to deal with this error:
Missing getMovies attribute on result {movies: Array(20)}
Here is my code, and I can see the data is fetched successfully in the response on dev tools in chrome:
{"data":{"movies":[{"__typename":"Movie","id":11,"overview":
Here is the code:
<template>
<div class="hello">
<ul>
<li v-for="movie in movies" :key="movie.id">{{movie.title}}</li>
</ul>
</div>
</template>
<script>
import gql from 'graphql-tag'
export default {
name: 'HelloWorld',
data(){
return {
movies: []
}
},
apollo: {
getMovies: {
query: gql`
query StarWars {
movies(query: "Star Wars") {
title
overview
poster_path
id
}
}
`,
result({data}){
this.movies = data.movies
}
}
},
props: {
msg: String
}
}
</script>
Per this issue, your apollo property should have a matching data property, but in this case they are mismatched (one is named movies and getMovies). Change one or the other:
export default {
name: 'HelloWorld',
data(){
return {
movies: []
}
},
apollo: {
movies: {
query: gql`
query StarWars {
movies(query: "Star Wars") {
title
overview
poster_path
id
}
}
`
}
},
props: {
msg: String
}
}
Setting the data yourself inside result isn't necessary.
这篇关于结果 Vue GraphQL 上缺少电影属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
