gpt4 book ai didi

javascript - 如何访问嵌套对象键

转载 作者:行者123 更新时间:2023-11-29 20:47:12 25 4
gpt4 key购买 nike

我正在尝试从包含嵌套对象的数据文件中获取值。

我想为 EN 对象下的每个条目创建一个标签。所以我想最终得到一个"mail" 标签、一个"quote" 标签和一个"phone" 标签。

在标签中我想通过访问它来放置tabLabeltabIcon的内容。

使用 Object.Keys() 我可以看到字符串,但是当我尝试 console.log 它们时,我得到了 undefined

我做了这个功能但是没有用:

function generateLabel() {
const keys = Object.keys(TabFormData.EN);
for (let i = 0; i < keys; i += 1) {
return `
<div class="${ID}_tab-form__headerItemWrap">
<label for="taLabel-here"><i class="tabIcon-here"></i></label>
</div>
`;
}
}

这是数据:

const TabFormData = {
EN: {
mail: [
{
tabLabel: 'Email Our Team',
tabIcon: 'fa fa-envelope',
},
{
label: 'First Name',
type: 'text',
name: 'name',
required: true,
hint: 'Please, provide your Name.',
},
{
label: 'Last Name',
type: 'text',
name: 'surname',
required: true,
hint: 'Please, provide your Last Name.',
},
{
label: 'Email Address',
type: 'email',
name: 'email',
required: true,
hint: 'Please, provide a valid email.',
},
{
label: 'Your Message',
type: 'textarea',
required: true,
name: 'message',
hint: 'Write us a message.',
rows: 20,
cols: 50,
},
{
label: 'About You',
required: true,
select: [
'Home use',
'Business use',
'Freelance, professional',
],
},
],
quote: [
{
tabLabel: 'Request a Quote',
tabIcon: 'fa fa-file-invoice-dollar',
},
{
label: 'First Name',
type: 'text',
name: 'name',
required: true,
hint: 'Please, provide your Name.',
},
{
label: 'Last Name',
type: 'text',
name: 'surname',
required: true,
hint: 'Please, provide your Last Name.',
},
{
label: 'Phone Number',
type: 'number',
name: 'telephone',
required: true,
hint: 'Please, provide a valid number',
},
{
label: 'Email Address',
type: 'email',
name: 'email',
required: false,
hint: 'Please, provide a valid email.',
},
{
label: 'Your Message',
type: 'textarea',
required: false,
name: 'message',
hint: 'Write us a message.',
rows: 20,
cols: 50,
},
{
label: 'About You',
required: true,
select: [
'Home use',
'Business use',
'Freelance, professional',
],
},
],
call: [
{
tabLabel: 'Call Me Back',
tabIcon: 'fa fa-phone',
},
{
label: 'First Name',
type: 'text',
name: 'name',
required: true,
hint: 'Please, provide your Name.',
},
{
label: 'Last Name',
type: 'text',
name: 'surname',
required: true,
hint: 'Please, provide your Last Name.',
},
{
label: 'Phone Number',
type: 'number',
name: 'telephone',
required: true,
hint: 'Please, provide a valid number',
},
{
label: 'About You',
required: true,
select: [
'Home use',
'Business use',
'Freelance, professional',
],
},
],
},
IT: {

},
};

最佳答案

你的问题在循环中。

for (let i = 0; i < keys; i += 1)

在这里你检查是否i小于一个数组对象,这不是你想要的。你要比较i相对于数组中的项目数。

所以会变成这样:

for (let i = 0; i < keys.length; i += 1)

你的字符串文字也是错误的,ID在这种情况下是一个 undefined variable 。我假设您想要 key 的名称。对于这个问题,它应该变成:

<div class="${keys[i]}_tab-form__headerItemWrap">

另外,一旦你return在 for 循环中,它会在第一次迭代时自动中断(这意味着您将始终只获得一个项目)。您可以做的是先构建整个字符串,然后返回它。

这将使您的函数变为:

function generateLabel() {
const keys = Object.keys(TabFormData.EN);
var str = "";
for (let i = 0; i < keys.length; i += 1) {
str +=
`<div class="${keys[i]}_tab-form__headerItemWrap">
<label for="taLabel-here"><i class="tabIcon-here"></i></label>
</div>
`;
}

return str;
}

Here's a Fiddle.

关于javascript - 如何访问嵌套对象键,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53944877/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com