小编Kay*_*een的帖子

我正在尝试通过 React with Apollo 进行一个非常基本的查询。

当我在 GraphiQL 中执行此查询时，我很好地得到了结果，但在我的应用程序中，我得到了一个未定义的数据对象。并显示错误消息：

网络错误：JSON 输入意外结束

查询是：

query {
    category(id: 3) {
        id
        children {
            id
            name
        }
    }
}

这是我的组件

import React, { Component } from 'react';
import { Query } from 'react-apollo';
import gql from 'graphql-tag';

const CATEGORIES_LIST = gql`
    query CATEGORIES_LIST {
        category(id: 3) {
            id
            children {
                id
                name
            }
        }
    }
`;

class Cat extends Component {
    render() {
        return (
            <div>
                <p>Items!</p>
                <Query query={CATEGORIES_LIST}>
                    {payload => {
                        console.log(payload);
                        return <p>fetch …

我一直在使用一些不同的 javascript 工具来生成五彩纸屑和庆祝效果。所有这些都是某种叠加图形。它阻止点击按钮、链接等。有什么方法可以将图层保留在前面，但忽略对该元素的实际点击，或者允许点击动画图层。

我现在尝试使用的脚本示例是：http ://codepen.io/iprodev/full/azpWBr/

html 示例

<canvas height='1' id='confetti' width='1'></canvas>

CSS

html, body {
  margin: 0;
  padding: 0;
  background: #000;
  height: 100%;
  width: 100%;
}
#confetti{
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
}

JavaScript

var retina = window.devicePixelRatio,

    // Math shorthands
    PI = Math.PI,
    sqrt = Math.sqrt,
    round = Math.round,
    random = Math.random,
    cos = Math.cos,
    sin = Math.sin,

    // Local WindowAnimationTiming interface
    rAF = window.requestAnimationFrame,
    cAF = window.cancelAnimationFrame || window.cancelRequestAnimationFrame,
    _now = Date.now …