在react渲染器中调用格式化函数是一种不好的做法吗？

Question

I have a function like:

const getTermsUrl = (list) => {
  const allianzInsurances = (list || []).filter(isAllianz)
  return get(first(allianzInsurances), 'productUrl', '')
}

also have a component with a render method like:

  ...
  render() {
    const { browser, list, selected, loading, invalidFields } = this.props

    // it`s bad practice to formating it in the render? 
    const termsAndConditionsProps = {
      browser,
      invalidFields,
      termsUrl: getTermsUrl(list), 
    }

    return (<TermsAndConditions {...termsAndConditionsProps} />)
  }
  ...

My question is: is it bad practice to format termsAndConditionsProps during render? Or is it better to keep the formatted version in the local state and format within the constructor?

Answer 1

It is ok to have lightweight formatting functions and call them inside of component's render method. It makes sense to move such computations in constructor if your prop's don't change. But in the case above your component already gets re-rendered every time when the list property gets updated. So in this case it's ok.