Boky Boky - 1 year ago 88
React JSX Question

Return an object with a function

I want to return an object with a function in React JS.

I have the next code :

let filters = [
{name: "PRICE_RANGE", values: [{active: "true", low: 10000, high: 21000}]}

getFilterValues(filters, filterName){
return filters.filter(f => {
if( === filterName) {
return {low: f.values.low, high: f.values.high};

<PriceFilter values={this.getFilterValues(filters, "PRICE_RANGE")} />

The result that I get is

{name: "PRICE_RANGE", values: [{active: "true", low: 10000, high: 21000}]}

But I want something like this :

{low: 10000, high: 21000}

Any advice why I'm getting whole array back and not the object?

Answer Source

Hope this snippet will be useful.

Create a generic function which will accept the key which you want to filter. Create an object and populate it with low & high value if it matches. Return the object.

  let filters = [{
  name: "PRICE_RANGE",
  values: [{
    active: "true",
    low: 10000,
    high: 21000

function filterMe(key){
 var newObj={};
   filters.filter(function(item,index) {
      if( === key){
    return newObj;


Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download