我有一个示例,在该示例中,我需要根据星期几和选定的小时数存储几个价格。此数据作为对象出现,需要作为Map()发送,因此后端可以使用它。不幸的是,它变成了一个对象。我认为它是在const price
内部发生的,但是我需要一个更好的解决方案,所以它永远不会发生。我该如何实现?
componentDidMount = async () => {
const dataFromDb = data.get('getting data here')
console.log('dataFromDb' ,dataFromDb) // Data from DB
let reservationPrice = new Map();
console.log('reservationPrice a Map()?', reservationPrice) // a Map();
console.log("Am I an object", dataFromDb.reservationPrice) // Object from DB
if (Object.entries(dataFromDb.reservationPrice).length === 0) {
console.log('entered') // not entering here
let maxHour = moment().startOf('day') // 00:00:00
let minHour = maxHour.clone().endOf('day') // 23:59:59
Object.keys(dataFromDb.schedule).map(key => { //getting schedule from DB
if (dataFromDb.operationSchedule[key] && moment(dataFromDb.operationSchedule[key].startTime, 'HH:mm') < minHour) {
minHour = moment(dataFromDb.operationSchedule[key].startTime, 'HH:mm')
}
if (dataFromDb.operationSchedule[key] && moment(dataFromDb.operationSchedule[key].endTime, 'HH:mm') > maxHour) {
maxHour = moment(dataFromDb.operationSchedule[key].endTime, 'HH:mm')
}
})
const hoursBetweenMinAndMax = moment.duration(maxHour.diff(minHour)).asHours()
let hours = new Map();
console.log('Am I a Map? hours', hours)
let auxHour;
for (let i = 0; i <= hoursBetweenMinAndMax; i++) {
auxHour = i !== 0 ? moment(minHour).add(i, 'hours') : moment(minHour)
hours.set(auxHour.format('HH:mm'), 0)
} // piece of code to get the min and max hour, then loop starting from the min hour and end until max hour: ex: 09:00, 10:00, 11:00...23:00
console.log('Am I a Map? hours', hours)
// let reservationPrice = new Map();
reservationPrice.set('monday', new Map(hours)) //shallow copy of hours
reservationPrice.set('tuesday', new Map(hours))
reservationPrice.set('wednesday', new Map(hours))
reservationPrice.set('thursday', new Map(hours))
reservationPrice.set('friday', new Map(hours))
reservationPrice.set('saturday', new Map(hours))
reservationPrice.set('sunday', new Map(hours))
console.log('reservationPrice', reservationPrice) // supposed to log with days and hours
console.log('Am I a Map()? reservationPrice', reservationPrice
instanceof Map) // A Map()
}
const price = Object.entries(dataFromDb.reservationPrice).length === 0 // dataFromDb.reservationPrice is an Object
? reservationPrice // reservationPrice is a Map();
: dataFromDb.reservationPrice // Here is turning an Object
console.log('Do I have days and hours?', price) // is an object, and not a Map();
console.log('Am I a Map()? price', price instanceof Map); //before: A Map() | //now: Now is an object;
this.renderFieldDetails(fieldId.id, price)
}
编辑---
如果我做类似price = Object.entries(fieldInfo.reservationPrice).length !== 0 ? reservationPrice : fieldInfo.reservationPrice
它变成了Map(),但是它是空的(如果数据库中已经有一些数据),并且在onChange函数下面,由于Map()为空而发生错误。
handlePriceInput = (e, hour, day) => {
let value = e.target.value
const newFieldReservationPrice = this.state.newFieldReservationPrice
console.log('newFieldReservationPrice is a Map()?', newFieldReservationPrice) //before: A Map() || now: not a Map() anymore
let map;
if (!newFieldReservationPrice instanceof Map) {
console.log('!== Map')
console.log('newFieldReservationPrice is a Map()? inside if ()', newFieldReservationPrice)
if (newFieldReservationPrice[day] && newFieldReservationPrice[day][hour]) {
newFieldReservationPrice[day][hour] = Number(value)
}
} else {
const newMap = new Map(Object.entries(newFieldReservationPrice))
console.log('newMap', newMap) // A Map()
map = new Map();
Object.keys(newFieldReservationPrice).forEach(key => {
map.set(key, new Map(Object.entries(newFieldReservationPrice[key])));
});
console.log('Am I a Map()? map', map)
const aux = map.get(day)
console.log('aux day', aux) // A Map()
aux.set(hour, Number(value)) // Comes as undefined || Cannot read property 'set' of undefined
console.log('aux set', aux) // A Map()
map.set(day, aux);
console.log('what do I have?', map)
}
const isReservationPrice = !newFieldReservationPrice instanceof Map ? newFieldReservationPrice : map
console.log('ggggg', isReservationPrice)
this.setState({
newFieldReservationPrice: isReservationPrice
})
}
谢谢! :)
答案 0 :(得分:1)
您可以将带有JavaScript普通对象作为参数的Object.entries()
传递给Map()
构造函数,以在新的Map
对象中创建键值对。
const o = {a:1, b:2, c:{d:3}};
const map = new Map(Object.entries(o));
console.log(map);