Question

我正在尝试从API返回一些数据，这给了我一个消息错误“ userAPI.filter不是函数”。该项目是用json服务器设置的，我还有一个db.js文件，其中包含对象数组。我遇到的问题是使过滤器与json服务器一起使用。我已经对其进行了测试，可以毫无问题地从本地.js文件获取数据。我什至可以从json服务器取回数据以获取所有用户。

当我在底部使用过滤器时，它似乎并没有工作。我有一种感觉，它与通过axios返回的数据有关，可能变量不是数组吗？但是它可以使所有用户返回。而且我非常确定该过滤器可以与文件中对象的测试用userAPI2数组一起正常工作。

  const axios = require('axios');

const Query = {
    greeting(parent, args, ctx, info) {
        if(args.name) {
            return `Hello ${args.name}!`
        } else {
            return 'Hello!'
        }
    },
    avengers(parent, args, ctx, info) {
        if(args.name) {
            return `Your favourite character is ${args.name}`
        } else {
            return 'Avengers Assemble!'
        }
    },
    hello(parent, args, ctx, info) {
        return "Hello World"
    },
    me() {
        return {
            id: "abc123",
            name: "John",
            email: "example@gmail.com",
            age: 32
        }
    },
    users(parent, args, {db}, info) {
        // Import from an external API server in this case json-server
        const userAPI = axios.get('http://localhost:3004/users')
        .then(response => {
            return response.data
        })

        if (!args.query) {
            // Import from local .js file
            return db.users 

            // Import from an external API server in this case json-server
            //return userAPI 
        }
            // Import from local .js file
            // return db.users.filter((user) => {
            //     return user.name.toLowerCase().includes(args.query.toLowerCase())
            // })

            const userAPI2 = [
                {
                id: '1',
                name: 'User1',
                email: 'user1@user1.com',
                age: 32,
                },
                {
                id: '2',
                name: 'User2',
                email: 'user2@user2.com',
                age: 32,
                },
                {
                id: '3',
                name: 'User3',
                email: 'user3@user3.com',
                age: 32,
                }
            ]

            // Import from local .js file
            // return db.users.filter((user) => {
            //     return user.name.toLowerCase().includes(args.query.toLowerCase())
            // })

            // Import from an external API server in this case json-server
            return userAPI.filter((user) => {
                return user.name.toLowerCase().includes(args.query.toLowerCase())
            })
    }
}

export {Query as default}

Answer 1

userAPI变量包含对axios.get的调用的返回值。 Axios请求方法（例如request，get，post等）返回一个Promise，它将解析为响应对象。响应对象本身包含data，在这种情况下将是一个数组。

如果要filter数据，则必须在解析程序返回的Promise链中这样做，例如：

users(parent, args, {db}, info) {
  return axios.get('http://localhost:3004/users')
    .then(response => {
      if (!args.query) {
        return response.data  
      }
      return response.data.filter((user) => {
        return user.name.toLowerCase().includes(args.query.toLowerCase())
      })
    })
}

或使用异步/等待：

users: async (parent, args, {db}, info) => {
  const { data } = await axios.get('http://localhost:3004/users')
  if (!args.query) {
    return data  
  }
  return data.filter((user) => {
    return user.name.toLowerCase().includes(args.query.toLowerCase())
  })
}

GraphQL查询返回错误.filter不是函数

1 个答案: