javascript - 努力通过从 ElasticSearch 返回的 JSON 进行映射
问题描述
我在 react.js + node.js + ElasticSearch 项目中取得了进展。但是,我遇到了一个我似乎无法弄清楚的问题。我想从弹性返回特定的 json 片段(如名称和描述),但我只能返回整个命中结果。我已经尝试过“.forEach()”和“.map()”和“.json()”,但还没有弄清楚。我希望能够显示每个结果命中的名称和描述。任何输入都会很棒!
反应:
import React, { Component } from 'react';
import axios from 'axios';
import ResultClub from './components/ResultClub';
class App extends Component {
constructor(props) {
super(props);
this.state = {
result: [],
userInput: '',
searched: false,
}
}
//assigning userInput a new value
handleChange = event=> {
event.preventDefault();
this.setState({userInput: event.target.value});
}
//retreiving elastic search data using userinput
handleSubmit = event=> {
event.preventDefault();
axios.get('http://localhost:4000/search?query=' + this.state.userInput)
.then(res => {
var result = res.data;
this.setState({ result: result,
searched: true,
});
console.log(this.state.result);
console.log(this.state.userInput);
})
}
//if user has searched, display the data
displayResults(props){
var searched = this.state.searched;
if (searched){
return <p> { JSON.stringify(this.state.result) } </p>;
}
}
render() {
return (
<div className="App">
<h2>hello from react</h2>
<form action="/search">
<input type="text" value={this.state.userInput} onChange={this.handleChange} placeholder="Search..." name="query" id="userText"/>
<button type="submit" onClick={this.handleSubmit}><i>Search</i></button>
</form>
{(this.displayResults())}
</div>
);
}
}
export default App;
节点:
const express = require('express');
const bodyParser = require('body-parser');
const morgan = require('morgan');
const JSON = require('circular-json');
const PORT = 4000;
var client = require ('./connection.js');
var argv = require('yargs').argv;
var getJSON = require('get-json');
const cors = require('cors');
let app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.use(cors({
origin: 'http://localhost:3001',
credentials: true
}));
app.get('/', function(req, res){
res.send("Node is running brother");
});
app.get("/search", function (request, response) {
let query = request.query.query;
client.search({
index: 'club',
type: 'clubinfo',
body: {
query: {
match: { "name": query}
},
}
},function (error, data, status) {
if (error) {
return console.log(error);
}
else {
// Send back the response
response.send(data.hits.hits);
}
});
});
app.listen(PORT, () => console.log('wowzers in me trousers, Listening on port ' + PORT));
ElasticSearch 返回(我想访问 hits.hits 中每个未命名对象的 _source.name):
{
took: 14,
timed_out: false,
-_shards: {
total: 5,
successful: 5,
skipped: 0,
failed: 0
},
-hits: {
total: 1,
max_score: 0.6931472,
-hits: [
-{
_index: "club",
_type: "clubinfo",
_id: "Tl2B3mgB0CGswaMHFVwp",
_score: 0.6931472,
_source: {
name: "Italian club",
tags: "pasta, food, eating, italian",
description: "we are italian!"
}
}
-{
_index: "club",
_type: "clubinfo",
_id: "Tl2B3mgB0CGswaMHFVwp",
_score: 0.3179638,
_source: {
name: "Old club",
tags: "golf, chair",
description: "we are Old people!"
}
}
]
}
}
解决方案
使用 Array#map 和解构从您的对象中获取所有名称。
const data = {took:14,timed_out:false,_shards:{total:5,successful:5,skipped:0,failed:0},hits:{total:1,max_score:.6931472,hits:[{_index:"club",_type:"clubinfo",_id:"Tl2B3mgB0CGswaMHFVwp",_score:.6931472,_source:{name:"Italian club",tags:"pasta, food, eating, italian",description:"we are italian!"}},{_index:"club",_type:"clubinfo",_id:"Tl2B3mgB0CGswaMHFVwp",_score:.3179638,_source:{name:"Old club",tags:"golf, chair",description:"we are Old people!"}}]}}
const res = data.hits.hits
.map(({_source:{name,description}})=>({name,description}));
console.log(res);
推荐阅读
- python - pytest-django:没有这样的数据库错误
- python - Anaconda 更新 scikit-learn 失败
- javascript - 每次我用阿拉伯语更改页面时,它都会先切换到英语,然后再切换到阿拉伯语
- r - 更改满足条件的一个但不是所有值
- ruby-on-rails - 为 Rspec 单元测试创建和保存记录
- node.js - In Bonjour how do I hook up a web server to advertised port?
- python - 熊猫输出文件没有分成不同的行
- r - 如何从顶点列表创建完整的diad列表
- python - Python中的非贪婪正则表达式
- mongodb - 在 mongoDB 中查找用户之间最近的位置,其中当前用户和用户集合都有一个位置数组