在const react/tyscript中调用功能

Question

在我的应用程序中，我想有条件地呈现一些东西，因此我制作了一个函数getItem，我想在自定义工具提示中调用，const constulpooltooltip。

如何使用自定义工具提示的返回调用该函数？目前，它呈现GetState（“ A”）， getstate（“ b”）， 工具提示上的GetState（“ C”）。请参阅下面的代码：

  const numberStates = 3;
  function getState({payload}: TooltipProps<ValueType, NameType>, state: string ){
    if(payload){
      for(let i = 0; i < numberStates; i++){
        if(payload[i].dataKey == state){
          return <p>{ payload[i] } : { payload[i].value }</p>
        }
      }
    }
    return null;
  }


  const CustomTooltip = ({ active, payload, label}: TooltipProps<ValueType, NameType>) => {
    if(active && payload && payload.length){
      return (
        <div className = "custom-tooltip">
          getState("A")
          getState("B")
          getState("C")
        </div>
      );
    }
    return null;
  }

Answer 1

您需要在括号中包围getState的呼叫：

  const CustomTooltip = ({ active, payload, label}: TooltipProps<ValueType, NameType>) => {
    if(active && payload && payload.length){
      return (
        <div className = "custom-tooltip">
          {getState("A")}
          {getState("B")}
          {getState("C")}
        </div>
      );
    }
    return null;

如果您试图在JSX中使用任何JavaScript功能，则应期望使用此语法。

可以找到更多信息在这里 关于React中的功能。您可以向下滚动到“示例：使用箭头功能传递参数”部分，并查看一个示例，以说明如何在状态上使用映射。