Javascript 在不重复代码的情况下呈现react组件

我有一个组件，它需要根据从父组件接收的道具加载某个项目

const Contract = ({ savingsFactors, isContract }) => (
    {isContract ? (
        <PutField
        label={label}
        placeholder={placeholder}
        onBlur={...}
        items={savingsFactors === 'true' ? FORM_VALUES : FORM_VALUES_NORMAL}
        />        
    ) : (
        <PutField
        label={label}
        placeholder={placeholder}
        onBlur={...}
        items={savingsFactors === 'true' ? ANOTHER_FORM_VALUES : ANOTHER_FORM_VALUES_NORMAL}
        />
    )}
);

有没有办法不需要重复这两段代码？

{
{
        let itemsToUse = savingsFactors === 'true' ? FORM_VALUES : FORM_VALUES_NORMAL;
        if (!isContract) {
            itemsToUse = savingsFactors === 'true' ? ANOTHER_FORM_VALUES : ANOTHER_FORM_VALUES_NORMAL
        }
        return <PutField
            label={label}
            placeholder={placeholder}
            onBlur={...}
            items={itemsToUse}
        />
   
    }

让itemsToUse=savingsFactors=='true'？形式值：形式值\u正常；
如果（！isContract）{
itemsToUse=savingsFactors=='true'？另一种形式的值：另一种形式的值\u正常
}
返回
}

{
让itemsToUse=savingsFactors=='true'？形式值：形式值\u正常；
如果（！isContract）{
itemsToUse=savingsFactors=='true'？另一种形式的值：另一种形式的值\u正常
}
返回
}

我总是希望尽可能明确：

const Contract = ({ savingsFactors, isContract }) => {
  const isSavingsFactors = savingsFactors === 'true';
  const formValues = isSavingsFactors ? FORM_VALUES : FORM_VALUES_NORMAL;
  const anotherFormValues = isSavingsFactors ? ANOTHER_FORM_VALUES : ANOTHER_FORM_VALUES_NORMAL;
  const items = isContract ? formValues : anotherFormValues;

  return <PutField
     label={label}
     placeholder={placeholder}
     onBlur={...}
     items={items}
  />
};

const Contract=（{savingsFactors，isContract}）=>{
常量isSavingsFactors=savingsFactors=='true'；
const formValues=isSavingsFactors？FORM_值：FORM_值_NORMAL；
const anotherFormValues=isSavingsFactors？另一种形式的价值观：另一种形式的价值观正常；
const items=isContract？formValues：另一个formValues；
返回
};

我总是希望尽可能明确：

const Contract = ({ savingsFactors, isContract }) => {
  const isSavingsFactors = savingsFactors === 'true';
  const formValues = isSavingsFactors ? FORM_VALUES : FORM_VALUES_NORMAL;
  const anotherFormValues = isSavingsFactors ? ANOTHER_FORM_VALUES : ANOTHER_FORM_VALUES_NORMAL;
  const items = isContract ? formValues : anotherFormValues;

  return <PutField
     label={label}
     placeholder={placeholder}
     onBlur={...}
     items={items}
  />
};

const Contract=（{savingsFactors，isContract}）=>{
常量isSavingsFactors=savingsFactors=='true'；
const formValues=isSavingsFactors？FORM_值：FORM_值_NORMAL；
const anotherFormValues=isSavingsFactors？另一种形式的价值观：另一种形式的价值观正常；
const items=isContract？formValues：另一个formValues；
返回
};

为什么不把条件放在你的

道具中

我试过了，但它不接受如果或三元链接，你能告诉我们你试过什么吗？它肯定可以这样工作。你也可以在组件上方定义一个变量

items

，找出它需要什么，然后传递给它

items={items}

为什么不把条件放在

items

prop内？我试过了，但它不接受if或trialchaining你能告诉我们你试过什么吗？它肯定可以这样工作。你也可以在组件上方定义一个变量

items

，找出它需要什么，然后传递给它

items={items}

我需要在const契约内部进行验证？我需要在const契约内部进行验证？