JSX / Lodash——在数组中返回唯一的对象属性值答案

【问题标题】：JSX / Lodash -- returning unique object property values in arrayJSX / Lodash——在数组中返回唯一的对象属性值
【发布时间】：2017-04-15 08:57:41
【问题描述】：

我正在尝试构建从对象数组中提取的唯一值数组。这是数据结构：

            data: [
           {
                "tags": [
                    {
                        "name": "tag",
                        "value": "Bold"
                    },
                    {
                        "name": "tag",
                        "value": "Crazy"
                    },
                    {
                        "name": "tag",
                        "value": "Colorful"
                    },
                    {
                        "name": "tag",
                        "value": "Smooth"
                    }
                ],
                "rating": 5,
                "userNickName": "lookinGood",
                "userLocation": "USA",
                "title": "LOVE IT",
                "reviewText": "Blah blah blah",
                "submissionTime": "14 January 2013"
            },
            {
                "tags": [
                    {
                        "name": "tag",
                        "value": "Colorful"
                    },
                    {
                        "name": "tag",
                        "value": "Too bright"
                    }
                ],
                "rating": 4,
                "userNickName": "CrazyColors",
                "userLocation": "USA",
                "title": "Kept It",
                "reviewText": "Hoopity hoo blah",
                "submissionTime": "13 December 2014"
            }
]

这是我的代码到目前为止的样子：

    let tags: Array<string> = _.sortBy(
            _.uniq(
            this.props.reviewData.reviews.map(
                (o) => {
                    return o.tags && o.tags.value ? o.tags.value.trim() : '';
                }
            )
        )
    );

但标签总是出现空白。我也尝试过return _.map(v.tags, 'value')，但这会返回多个数组。那么如何从多个对象中获取每个标签值之一呢？

【问题讨论】：

标签： arrays react-native lodash react-jsx jsx

【解决方案1】：

您需要提取标签数组，将数组扁平化为一个数组，并获取唯一值：

var result = _(data) // start the chain
  .map('tags')  // extract the tag arrays
  .flatten() // combine to one array
  .uniqWith(function(tag1, tag2) {
    return _.get(tag1, 'value', '').trim() === _.get(tag2, 'value', '').trim();
  }) // get the unique values
  .sortBy('value');

var data = [{
  "tags": [{
    "name": "tag",
    "value": "Bold"
  }, {
    "name": "tag",
    "value": "Crazy"
  }, {
    "name": "tag",
    "value": "Colorful"
  }, {
    "name": "tag",
    "value": "Smooth"
  }],
  "rating": 5,
  "userNickName": "lookinGood",
  "userLocation": "USA",
  "title": "LOVE IT",
  "reviewText": "Blah blah blah",
  "submissionTime": "14 January 2013"
}, {
  "tags": [{
    "name": "tag",
    "value": "Colorful"
  }, {
    "name": "tag",
    "value": "Too bright"
  }],
  "rating": 4,
  "userNickName": "CrazyColors",
  "userLocation": "USA",
  "title": "Kept It",
  "reviewText": "Hoopity hoo blah",
  "submissionTime": "13 December 2014"
}];

var result = _(data) // start the chain
  .map('tags')  // extract the tag arrays
  .flatten() // combine to one array
  .uniqWith(function(tag1, tag2) {
    return _.get(tag1, 'value', '').trim() === _.get(tag2, 'value', '').trim();
  }) // get the unique values
  .sortBy('value');

console.log(result);

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.2/lodash.min.js"&gt;&lt;/script&gt;

【讨论】：