Question

我是新来的反应者，所以我想我还没有正确理解使用效果和useStates如何防止此错误。我已经尝试将useEffect数组中的状态设置为仅在更改时呈现，但也没有成功。我正在尝试从诀窍应用程序（没有代码数据库应用程序创建者）构建动态表单配置。因此，最终结果将是一个可用于呈现表单的配置。下面是我的代码示例。

const [fields, setObject] = useState([]);
const [groups, setGroup] = useState();
const [fieldGroupConfig, setFieldGroupConfig] = useState();
const [formConfig, setFormConfig] = useState();


useEffect(() => {

    axios.get(KnackUrl('entityDefinitions-ObjectBased', "object_4"), { headers: KnackHeaders() })
        .then(response => {
            setObject(response.data.object.fields)
        })


    axios.get(KnackUrl('getMultiple-ObjectBased', "object_31"), { headers: KnackHeaders() })
        .then(response => {
            setGroup(response.data.records)
        })

    axios.get(KnackUrl('getMultiple-ObjectBased', "object_32"), { headers: KnackHeaders() })
        .then(response => {
            setFieldGroupConfig(response.data.records)
        })
 
}, [])



if(groups && fieldGroupConfig && fields){
    groups.forEach((group) => {
        group.fields = [];
        fieldGroupConfig.forEach((fieldGroup) => {
          if (fieldGroup.field_333_raw[0].id === group.id) {
            fields.forEach((field) => {
              if (fieldGroup.field_330 === field.key) {
                group.fields.push(field);
              }
            });
          }
        });
    });
    setFormConfig(groups);
    
}
console.log('group prepared =>', formConfig);

谢谢！

反应太多。 useEffect + useState + axios

0 个答案: