ReactJS查询变量

不确定我做错了什么，但我在单击“提交”按钮后收到以下错误消息：

TypeError:this.props.ObjectQuery不是函数 查询代码如下：

   const ObjectQuery  = gql`
   query($timestamp: Float!){
    action(timestamp: $timestamp){
      action
      timestamp
        object{
          filename
    }
  }
}


`;

class UserList extends React.Component {
  render() {
  
    return (
          
        ({ loading, error, data }) => {
          if (loading) return <p>Loading...</p>;
          if (error) {
            console.log(error);
            return <p>Error</p>;
          }

          if (data.action.length === 0) return <div>No Objects</div>;

          return (//this code binds the query above to the output and puts it on the screen.
            <Item.Group divided>
            {data.action.map(action => (
              <div>
              <ul>
                <li key = {action.action}>{action.action}</li>
                <li key = {action.timestamp}>{action.timestamp}</li>
                <ul>
                  {action.object.map((obj) => {
                    return (<li>{obj.filename}</li>)
                  })}
                </ul>
              </ul>
            </div>
          ))}
            </Item.Group>
          );
        }
       
    )};
  }
export default graphql(ObjectQuery, {
    options: (props) => ({variables: {timestamp: props.timestamp}})
})(UserList);

    

---

首先，您没有将ObjectQuery创建为函数。您将其初始化为常量

const ObjectQuery  = gql`
   query($timestamp: Float!){
    action(timestamp: $timestamp){
      action
      timestamp
        object{
          filename
    }
  }
}`;

如果希望它成为函数，请将其创建为函数。也可以通过导出它在其他零部件上使用它。您可以通过添加

export

export function ObjectQuery() {
    gql`
query($timestamp: Float!){
 action(timestamp: $timestamp){
   action
   timestamp
     object{
       filename
 }
}
}
`;

}

此外，this.props.ObjectQuery无效，因为您没有将其添加到组件中。但是，既然导入了ObjectQuery，现在就可以将其用作函数了

this.setState({ inputValue: new Date(document.getElementById("time").value).valueOf() });
    ObjectQuery({ // no this.props
        variables: {
            timestamp: this.state.inputValue
        },

    });

顺便说一句，如果两个文件在同一个文件夹中，您可以使用

import ObjectQuery from './UserList';

---

首先，您没有将ObjectQuery创建为函数。您将其初始化为常量

const ObjectQuery  = gql`
   query($timestamp: Float!){
    action(timestamp: $timestamp){
      action
      timestamp
        object{
          filename
    }
  }
}`;

如果希望它成为函数，请将其创建为函数。也可以通过导出它在其他零部件上使用它。您可以通过添加

export

export function ObjectQuery() {
    gql`
query($timestamp: Float!){
 action(timestamp: $timestamp){
   action
   timestamp
     object{
       filename
 }
}
}
`;

}

此外，this.props.ObjectQuery无效，因为您没有将其添加到组件中。但是，既然导入了ObjectQuery，现在就可以将其用作函数了

this.setState({ inputValue: new Date(document.getElementById("time").value).valueOf() });
    ObjectQuery({ // no this.props
        variables: {
            timestamp: this.state.inputValue
        },

    });

顺便说一句，如果两个文件在同一个文件夹中，您可以使用

import ObjectQuery from './UserList';

---

@riyajkhan你做了什么编辑？尝试学习平台。另外，当我尝试使用@your name时，没有得到解析。添加了graphql标记，因为它与特定的graphql相关issues@riyajkhan你做了什么编辑？尝试学习平台。另外，当我尝试使用@your name时，没有得到解析。添加了graphql标记，因为这与特定的graphql问题有关。现在，我得到了以下错误：

>59 |导出默认graphql（ObjectQuery，{60 | options:（props）=>（{variables:{timestamp:props.timestamp}}）61 |}）（UserList）；62 |

尝试了这个，但仍然一无所获。当一个产品不符合文档要求时，它会让人恼火。我已经在这里修改代码好几个小时了，以为我做错了什么，5个小时后才发现不是我，而是产品中的一个bug。是的。这真是一个令人沮丧的家庭。很抱歉，我帮不了你。现在我遇到了以下错误：

>59 |导出默认图形ql（ObjectQuery，{60 |选项：（props）=>（{变量：{timestamp:props.timestamp}）61 |}）（UserList）；62 |

尝试了这个，但仍然一无所获。当一个产品不符合文档要求时，它会让人恼火。我已经在这里修改代码好几个小时了，以为我做错了什么，5个小时后才发现不是我，而是产品中的一个bug。是的。这真是一个令人沮丧的家庭。对不起，我帮不了你。