将对象转换为数组reactjs和ramda

Question

给定以下数据：

    const state = {
        products: {

        newValues: {
          "1": {
            "product_id": 1,
            "name": "Product 1"
          },
          "2": {
            "product_id": 2,
            "name": "Product 2"
          },
        },
        newValuescat:{
          "61": {
            "category_id": 61,
            "name": "category name"
          }
        }
        }
}

我是React和Ramda的新手。 如何使用ramda以及我必须使用哪个函数在数组中进行转换。

Answer 1

我从这里偷了一些代码： 在JavaScript中将Object {}转换为array []

var obj = {"1":5,"2":7,"3":0,"4":0,"5":0,"6":0,"7":0,"8":0,"9":0,"10":0,"11":0,"12":0}
var result = Object.keys(obj).map(function(key) {
  return [Number(key), obj[key]];
});

这应该做！

Answer 2

我不太清楚你想要什么。 但是，根据我的最佳猜测，这是两种可能的解决方案：

 const makeArrays = R.evolve({products: R.map(R.values)}) const state = {"products": {"newValues": {"1": {"name": "Product 1", "product_id": 1}, "2": {"name": "Product 2", "product_id": 2}}, "newValuescat": {"61": {"category_id": 61, "name": "category name"}}}} console.log(makeArrays(state)) 

 <script src="//cdnjs.cloudflare.com/ajax/libs/ramda/0.25.0/ramda.js"></script> 

从内到外，这里就是它的作用： R.values是一样一样的Object.values ，获取对象的思想为键值对的列表，并只返回值的列表。 将其传递给R.map并提供products对象，我们映射products的元素，将其替换为对每个元素中R.values的调用。 最后， R.evolve接受一个规范对象，该对象提供要在其每个键上运行的功能，并使用这些功能进行转换和对象。

---

我的第二个版本是相似的，仍然使用map(values) ，但使用一个稍微更标准的工具比Ramda的evolve ，被称为镜头：

 const makeArrays = R.over(R.lensProp('products'), R.map(R.values)) const state = {"products": {"newValues": {"1": {"name": "Product 1", "product_id": 1}, "2": {"name": "Product 2", "product_id": 2}}, "newValuescat": {"61": {"category_id": 61, "name": "category name"}}}} console.log(makeArrays(state)) 

 <script src="//cdnjs.cloudflare.com/ajax/libs/ramda/0.25.0/ramda.js"></script> 

镜头可让您将注意力集中在数据结构的一部分上，而其余部分保持不变。 您可以使用R.view访问该属性，使用R.view对该属性进行R.set ，或使用R.over对其进行R.over 。 产生镜片有几种功能。 在这里，我们使用R.lensProp ，它将注意力集中在对象的命名属性上。

隐形眼镜处于函数式编程世界比Ramda的多个专有更广泛认可的工具， evolve 。 但是它们是为不同的事物而设计的。 镜头本应专注于结构的特定部分，但要对它进行任何操作， evolve可让您调整结构的许多部分，但不能像镜头那样简单地进行操作。 因为您只想调整单个属性，所以这两种方法都可以在这里使用。

Answer 3

简单的版本是：

<div>{R.compose(
  R.values,
  R.map((item: any) => renderYourJsx(item))
 )(this.props.yourData)}</div>

R.values将您的对象转换为数组，然后使用R.map映射数组项。 您可以将它们都包装在R.compose然后将对象直接传递到compose函数。