在 reactjs 中获取 neo4j 数据

Fetch neo4j data in reactjs

我正在尝试从我的 neo4j 数据库中获取数据并将它们显示在卡片中。 这是我获取数据的函数:

 constructor(props){
        super(props);
        this.state = {
            data: []
        }
    }

async componentDidMount() {

        const neo4j = require('neo4j-driver')
        const driver = neo4j.driver('bolt://localhost:7687', neo4j.auth.basic('neo4j', 'pass'))
        const session = driver.session({database: 'mydatabase'})
        let result = null
        
        try {

            result = await session.run(
                "MATCH (a:Person { userid: $userID })<-[:`has relation`]-(b:Job)-[:`another relation`]->(c:Person) RETURN b.name AS name, c.job +' '+ c.additional_job AS job",
                {
                    userID: userID
                }
            )

        } catch (error) {
          console.log(`unable to execute query. ${error}`)
        } finally {
            await session.close()
        }
        
         await driver.close()
         this.setState({
             data: result.records
        })

         
    }

这是渲染方法:

render(){

       
        
        return(
         <section>
              <h1>my jobs</h1>
               
             { Object.keys(this.state.data).map((item, index) => <MyCard key={index} name={item.name} job={item.job}/>) }
         </section>   
          
        );
    }

但它显示以下错误:

TypeError: data.map is not a function

你能告诉我这里缺少什么吗?

而且,目前我正在使用异步 function ( async fetchData() ) 来获取数据。我应该使用 componentDidMount() 函数从 neo4j 数据库中获取数据吗?

我在控制台中得到以下信息:

 Promise {<pending>}
    [[Prototype]]: Promise
    [[PromiseState]]: "fulfilled"
    [[PromiseResult]]: Array(2)
        0: Record
            keys: (2) ['name', 'job']
            length: 2
            _fieldLookup: {name: 0, job: 1}
            _fields: (2) ['name 1', 'first job another job']
            [[Prototype]]: Object
        1: Record
            keys: (2) ['name', 'job']
            length: 2
            _fieldLookup: {name: 0, job: 1}
            _fields: (2) ['name 2', ' second job another job ']
            [[Prototype]]: Object
            length: 2
            [[Prototype]]: Array(0)

JavaScript 中的对象 {} 没有方法 .map()。它仅适用于数组,[].

因此,为了让您的代码正常工作,请将 data.map() 更改为 data.products.map(),因为产品是一个您可以对其进行迭代的数组。