工作中遇到双箭头函数一个bug

    1. const handleRhythmPower = (index: number) => (power: boolean) => {
    2.   // CODE
    3. }
    6. // 调用
    7. <RhythmsItem
    8.   // eslint-disable-next-line react/no-array-index-key
    9.   key={index}
    10.   index={index}
    11.   disabled={disabled}
    12.   name={name}
    13.   hour={hour}
    14.   minute={minute}
    15.   isValid={power}
    16.   icon={icons[icon]}
    17.   brightness={brightness}
    18.   temperature={temperature}
    19.   is24Hour={is24HourState}
    20.   onPower={() => handleRhythmPower(index)}
    21. />
    23. //子组件里面
    25. <Button size={40} disabled={disabled} onPress={() => onPower && onPower(isValid)}>
    26.   <View style={styles.itemBtn}>
    27.     <IconFont
    28.       useART={true}
    29.       name={isValid ? 'minus' : 'plus'}
    30.       size={cx(12)}
    31.       color={themeColor}
    32.     />
    33.   </View>
    34. </Button>

    这样子组件使用的是hooks，调用只会进行到onPower={() => handleRhythmPower(index)}这个箭头函数里，不会到handleRhythmPower里面

    1 解决办法
    A. 我把双箭头函数改为一般的函数就问题解决

    B. 我之前用的是class写法，不出现这个问题。用hooks之后出现这个问题

    目前解释原理似懂非懂。