Question

我在制作动态联系表单时遇到问题，其中所有输入均基于JSON配置呈现。 JSON配置应可以从API端点使用AJAX进行获取（使用静态端点以JSON格式获取数据）。您可以根据以下内容将更多的filds添加到JSON 示例结构。提交给API之前，应根据配置验证所有输入。如果未通过验证，则显示错误输入下方的消息。支持的输入类型为：数字，选择，文本，电子邮件，文本区域。对于输入类型选择，您应该使用选项在配置中提供。所有输入都应保存在本地状态。 data.json文件如下所示。请如果您有解决方案请帮助我预先感谢。

 {

  "form_inputs": [
    {

  "label": "Sender Email",
  "name": "sender_mail",
  "type": "email",
  "value": null,
  "rules": "required|min:3|max:64",
  "options": [],
  "default_value": null,
  "multiple": false,
  "readonly": false,
  "placeholder": "Sender Email",
  "info": "Example value of how to fill the input"
},
{
  "label": "Person name",
  "name": "person_name",
  "type": "text",
  "value": null,
  "rules": "required|min:3|max:64",
  "options": [],
  "default_value": null,
  "multiple": false,
  "readonly": false,
  "placeholder": "Person name",
  "info": "Example value of how to fill the input"
},
{
  "label":"Country",
  "name":"country",
  "type":"select",
  "value": null,
  "rules":"required|min:2|max:64",
  "options":[
    {
      "label":"Albania",
      "value":"albania"
    },
    {
      "label":"Italy",
      "value":"italy"
    }
  ],
  "default_value":"albania",
  "multiple":false,
  "readonly":false,
  "placeholder":"select",
  "info":"Example value of how to fill the input "
}
 ] 
}

如何显示react.js中的json文件中的react组件？

0 个答案: