[英]Selecting a json key-value pair dynamically in React
I have a json like this one: 我有一个像这样的json:
{
"index": 1,
"ln": "27953",
"name": "Product 1",
"availability": {
"day0726": "G",
"day0727": "G",
"day0728": "G",
}
}
And I'd like to display the availability dynamically based on what date is it. 我想根据日期来动态显示可用性。 "day0726" is July 26 for example.
例如,“ day0726”是7月26日。 How could I display the value of the correct day using the following code piece:
如何使用以下代码段显示正确日期的值:
import React from "react"
import Product from "./Product"
const Productlist = ({ prodlist }) => {
return (
<div>
{
prodlist.map((item, i) => {
return (
<Product
key={prodlist[i].index}
name={prodlist[i].name}
ln={prodlist[i].ln}
availability={*this is I want to change dynamically*}
/>
)
})
}
</div>
)
}
export default Productlist
Can it be done or is train of thought completely wrong? 可以做到还是思路完全错误?
Thank you in advance! 先感谢您!
EDIT: I can change the date key format to anything if that's necessary. 编辑:如有必要,我可以将日期键格式更改为任何格式。
You first have to create a Date of the format you have and then you can use that in the component to get the products availability
at a certain key: 您首先必须创建一个具有自己格式的日期,然后可以在组件中使用该日期以某个特定的键获取产品
availability
:
let date = new Date(); function str_pad(n) { return String("00" + n).slice(-2); } date = "day"+(str_pad(date.getMonth()+1))+str_pad(date.getDate()); console.log(date)
import React from "react"
import Product from "./Product"
let date = new Date();
function str_pad(n) {
return String("00" + n).slice(-2);
}
date = "day"+(str_pad(date.getMonth()+1))+str_pad(date.getDate());
const Productlist = ({ prodlist }) => {
return (
<div>
{
prodlist.map((item, i) => {
return (
<Product
key={prodlist[i].index}
name={prodlist[i].name}
ln={prodlist[i].ln}
availability={prodlist[i].availability[date]}
/>
)
})
}
</div>
)
}
export default Productlist
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.