多个查询，在同一目录中显示结果
多个查询，在同一目录中显示结果
提问于 2019-04-05 19:32:37
点击热门时，如何将内容替换为新查询的结果(getPopular)？
( v-for="casino in allCasinos“需要显示: v-for="casino in getPopular”)
<div @click="activate(1); getPopular();">Popular</div>
<div @click="activate(2); getNew();">New</div>
<div id="list" v-for="casino in allCasinos" :key="casino.name">
<div v-if="$apollo.loading">Loading...</div>
<div>{{ casino.name}}</div>
</div>
<script>
import gql from 'graphql-tag';
methods: {
activate:function(el){
this.active_el = el;
},
},
apollo: {
allCasinos: gql`{
allCasinos(limit: 6) {
name,
}
}`,
getPopular: gql`{
getPopular(limit: 6) {
name,
}
}`,
getNew gql`{
getNew(limit: 6) {
name,
}
}`,
</script>回答 2
Stack Overflow用户
发布于 2019-04-05 20:05:09
在这种情况下，没有理由使用单独的查询-使用一个带有filter (除了limit)参数的公共查询。
更新
casinos: gql`query casinos($filter: String!) {
casinos(filter: $filter, limit: 6) {
name
}
}`,Stack Overflow用户
发布于 2019-04-05 20:07:47
您可以定义一个本地数据属性casinos，用于存储要显示的当前赌场集。您可以在每个click处理程序中设置casinos的值。最后，您可以在v-for中使用casinos而不是allCasinos
<div @click="activate(1); casinos = getPopular();">Popular</div>
<div @click="activate(2); casinos = getNew();">New</div>
<div id="list" v-for="casino in casinos" :key="casino.name">
<div v-if="$apollo.loading">Loading...</div>
<div>{{ casino.name}}</div>
</div>
<script>
import gql from 'graphql-tag';
data: function () {
return {
casinos: this.allCasinos
}
},页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55534451
复制相关文章
相似问题
腾讯云开发者
