javascript - 对象和嵌套对象生成

标签 javascript reactjs

我有一个自动生成的对象

this.state={
 fruits = []
}

这是我如何生成对象并插入到fruits

const gen = (fruitname, price) => {
     this.setState({
        this.state.fruits: {...this.state.fruits, [fruitname]: price}
    })
}

输出为

{apple: "$2", banana: "$4", orange: "$6"}

现在我需要嵌套类型,如下所示

   {apple: {
        "red": "$3",
        "Cripps": "$3",
        "Honeycrisp": "$5"
    }, 
    banana: {
        "small": "$4",
        "yellow": "$5",
        "green": "$2"
    },
    ...
   }

我将代码更新为

 const gen = (fruitname, price, types, eachPrice) => {
         this.setState({
            this.state.fruits: {...this.state.fruits, [fruitname]: { [types]: eachPrice} }
        })
    }

但是,每次输入时,我只能获得每种水果的一个对象

{苹果:{ “红色”:“3 美元”, }, 香蕉: { “小”:“4 美元”, }, ... }

如何保留全部?

最佳答案

如果我理解正确,您正在尝试将类型(键)数组映射到对象中的值(eachPrice)。如果是这种情况,您可以使用 .reduce 来实现此目的。在这里,我将 types 数组简化为一个对象,其中每个 type 都是一个键,每个值都是 eachPrice 数组中对应的价格。

参见下面的示例:

let state = {}
const gen = (fruitname, types, eachPrice) => {
  state.fruit = {...state.fruit,
    [fruitname]: 
      types.reduce((acc, t, i) => (
        { ...acc, [t]: eachPrice[i]}
      ), {})
  }
}

gen("apple", ["red", "Cripps", "Honeycrisp"], ["$3", "$3", "$5"]);
gen("banana", ["small", "yellow", "green"], ["$4", "$5", "$2"]);
       
console.log(state.fruit);

请注意,此函数不使用 price 参数,因为您可以使用 eachPrice 来定义价格。

关于javascript - 对象和嵌套对象生成,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54701757/

相关文章:

javascript - 无法使用 Ajax Json 响应填充表

css - Scala.js - 将 css 文件的内容注入(inject)内联 <style> 标签

reactjs - craco 和 antd 的主题切换怎么用?

javascript - getElementsByTagName() 在 IE 和 FF 中的行为不同

javascript - 输入文本类型在查看源代码中显示未定义

javascript - 根据鼠标移动动画 css [我该如何改进]

css - 如何使行通过不影响列表中的整个文本

javascript - React - (嵌套) Prop 类型无效;它必须是一个函数

javascript - 未捕获( promise )TypeError : Cannot read property 'createElement' of undefined(…)

javascript - 将 javascript 对象保存为字符串