ReactJS에서 lodash를 사용하여 고유 값을 얻는 방법?

Question

ReactJS에서 lodash를 사용하여 고유 값을 얻는 방법은 무엇입니까? 이제 모든 데이터를 가져옵니다. 그러나 중복 데이터 인쇄를 피하는 방법은 무엇입니까? 사실 그것은 필터 박스입니다. 그래서 데이터 반복은 피해야합니다. 누구든지 나를 도울 수 있습니까?

는 기능 :

comboClick() { 
    var apiBaseUrl = "http://api.eventsacross-stage.railsfactory.com/api/"; 
    var input = this.state.search_event; 
    let self = this; 
    axios.get(apiBaseUrl+'v1/events/?on_dashboard=false'+input) 
    .then(function (response) { 
     let events = response.data.events; 
     self.setState({events: events}); 
     console.log(response); 
    }) 
    .catch(function (error) { 
     console.log(error); 
    }); 
    } 

Jsx 부 :

<div className="dropdown text-center"> 
        <button 
        className="btn btn-default dropdown-toggle" 
        type="button" 
        data-toggle="dropdown" 
        style={{width: "50%"}} 
        onClick={this.comboClick.bind(this)}> 
         Place 
         <span className="caret"></span> 
        </button> 
        <ul className="dropdown-menu"> 
        {this.state.events.map(function (event, i) { 
         return (
         <div key={i}> 
          {event.locations.map(function (locations, j) { 
          return (
           <li key={j}><p>{locations.city}</p></li> 
          ) 
          })} 
         </div> 
        ) 
        })} 
        </ul> 
       </div> 

Answer 1

당신은 documentation에 따라, _.uniqBy를 사용할 수 있습니다

이 방법은 iteratee을 허용하는 것을 제외하고 _.uniq 같다 배열의 각 요소에 대해 이 호출되어 기준을 생성합니다. 고유성이 계산됩니다. 결과 값의 순서는 배열에서 발생하는 순서대로 에 의해 결정됩니다. iteratee는 하나의 인수 (값)로 호출됩니다.

나는 예를 추가했습니다 :

var locations = 
 
[ 
 
{city:"city1"}, 
 
{city:"city2"}, 
 
{city:"city3"}, 
 
{city:"city1"}, 
 
]; 
 

 
var locationsUnique = _.uniq(locations, 'city'); 
 

 
console.log(locationsUnique);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js"></script>

UPDATE : 나는 당신이하고 싶은 것은 같은데요 의견을 공유하는 방법에서

예 :

comboClick() { 
    var apiBaseUrl = "api.eventsacross-stage.railsfactory.com/api/"; 
    var input = this.state.search_event; 
    let self = this; 
    axios.get(apiBaseUrl + 'v1/events/?on_dashboard=false' + input).then(function(response) { 
    let events = response.data.events; 
    for (var i = 0; i < response.data.events_count; i++) { 
     var obj = response.data.events[i]; 
     console.log(obj.locations); 
     //Assuming that obj.locations has the locations that you want to display 
     var locationsUnique = _.uniq(obj, 'city'); //Added this line 
     console.log(locationsUnique); //Added this line 
    } 
    for (var j = 0; j <= obj; j++) {} 
    self.setState({events: events}); 
    }).catch(function(error) { 
    console.log(error); 
    }); 
}