Блог

Технология: React-Native

Желаемый результат: я пытаюсь передать функцию между компонентами. Я хочу theFun.theFun() вызвать, но он не запускается:

Исключение компонента theFun.theFun не является функцией. (В ‘theFun.theFun(«2», «1», » Синяя креветка»). ‘theFun.theFun’ не определено

Что я пробовал: я пробовал {storeMeaturement} vs {()=> storeMeasurement("2","1","blueShrimp"} vs { storeMeasurement(«2″,»1″,» blueShrimp»} в определении компонента и theFun={storeMeasurement} vs theFun={storeMeasurement("2","1","blueShrimp")} в теге. Я пробовал и другие вещи, но безрезультатно.

Вот код:

Где я использую тег

 <ModalPurpleCard theList={["10","91","thermometer"]}  theFun={storeMeasurement} ></ModalPurpleCard>
  

Где я определяю тег

 function ModalPurpleCard(theList:any, theFun:any ) {// , theFun:function

  let [visOpen, setVisOpen] = React.useState(true);
  let [stillLoad, setStillLoad] = React.useState(true);

  //let theFig = Math.round(Math.random() *10   90)
  let theFig = Number(theList.theList[0])   Number(theList.theList[1])
  console.log(theFig)

  if (visOpen){
    return(
      <TouchableOpacity onPress={()=> setVisOpen(false)}>
        <View style={{zIndex:3}}>
          <ModalSecCard  >
            <Text style={{color:"#fff"}}>{theList.theList[2]}</Text>
          </ModalSecCard>
        </View>
      </TouchableOpacity>
    )

  } else{
      if(stillLoad){
        return(
          <TouchableOpacity onPress={theFun.theFun("2","1","blueShrimp")}>
          <ActivityIndicator animating={true} color="#333366"/>
          </TouchableOpacity>
        )
      } else {return(
        <Text>{theFig}</Text>
  )}
    
  }
  
}
  

Заключение:
Для меня странно то, что theList это отлично работает и успешно передается между компонентами. Однако функция этого не делает.

Попробуйте это

 
function ModalPurpleCard(props) {// , theFun:function

  let [visOpen, setVisOpen] = React.useState(true);
  let [stillLoad, setStillLoad] = React.useState(true);

  //let theFig = Math.round(Math.random() *10   90)
  let theFig = Number(props.theList[0])   Number(props.theList[1])
  console.log(theFig)

  if (visOpen){
    return(
      <TouchableOpacity onPress={()=> setVisOpen(false)}>
        <View style={{zIndex:3}}>
          <ModalSecCard  >
            <Text style={{color:"#fff"}}>{props.theList[2]}</Text>
          </ModalSecCard>
        </View>
      </TouchableOpacity>
    )

  } else{
      if(stillLoad){
        return(
          <TouchableOpacity onPress={() => props.theFun("2","1","blueShrimp")}>
          <ActivityIndicator animating={true} color="#333366"/>
          </TouchableOpacity>
        )
      } else {return(
        <Text>{theFig}</Text>
  )}
    
  }
  
}
  

Реквизиты передаются внутри props объекта, а не как отдельные параметры. Вам нужно уничтожить ваши реквизиты в определении ModalPurpleCard функции:

 function ModalPurpleCard({ theList:any, theFun:any }) {
/* ... */
}