在 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()
,因为产品是一个您可以对其进行迭代的数组。
我正在尝试从我的 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()
,因为产品是一个您可以对其进行迭代的数组。