Блог

Я создал предупреждающее сообщение в react native, и при нажатии оно вызывает функцию. Но у меня есть сообщение об ошибке:

_this.function1 не является функцией.(В ‘_this.goToMapBack(‘1′)’, ‘_this.goToMapBack’ не определено)

   alertFunction(){
    Alert.alert(
      "Text Message",
      [
        {
          text: 'Yes',
          onPress: this.function1('1'),
        },
        {
          text: 'No',
          onPress: this.function1('2'),
        },
      ],
      {cancelable: false},
    );
  }

  function1(value){
    if (value =='1') {
      var url = "XXXXX";
    }
    else{
      var url = "YYYYY"
    }
    Linking.openURL(url);
  }

  render() {
    const valueNb = navigation.getParam('valNb', '1');
    return (
        <View>
                <Button
                      onPress={this.alertFunction.bind(valueNb)}
                      title="qwerty"
                      color="#ffffff"
                    />
  

Я также тестировал onPress: function1(‘1’), onPress: () => this.function1(‘1’), но функция всегда не определена.

Вы знаете, как это исправить?

Преобразуйте вашу анонимную функцию в функцию со стрелкой, чтобы получить this контекст:

Функция Arrow автоматически привязывается к своему родительскому элементу (вам не нужно привязывать ее явно) … потому что у нее нет собственного контекста

 class Comp {
  alertFunction = () => {
    Alert.alert(
      "Text Message",
      [
        {
          text: "Yes",
          onPress: this.function1("1")
        },
        {
          text: "No",
          onPress: this.function1("2")
        }
      ],
      { cancelable: false }
    );
  };

  function1 = value => {
    if (value == "1") {
      var url = "XXXXX";
    } else {
      var url = "YYYYY";
    }
    Linking.openURL(url);
  };

  render() {
    const valueNb = navigation.getParam("valNb", "1");
    return (
      <View>
        <Button onPress={this.alertFunction} title="qwerty" color="#ffffff" />
      </View>
    );
  }
}
  

Если вы решите использовать анонимную функцию

Вам нужно привязать свою функцию в конструкторе … потому что анонимная функция имеет свой собственный контекст… вот почему вам нужно указать ему использовать this контекст вашего компонента вместо этого

Вы можете привязать свою функцию anonymouns, когда передаете ее своему on Press . но это не рекомендуется, потому что при каждом вызове будет создаваться новая копия вашей функции

 class Comp {
  constructor(props) {
    super(props);

    this.function1 = this.function1.bind(this);
    this.alertFunction = this.alertFunction.bind(this);
  }

  alertFunction() {
    Alert.alert(
      "Text Message",
      [
        {
          text: "Yes",
          onPress: this.function1("1")
        },
        {
          text: "No",
          onPress: this.function1("2")
        }
      ],
      { cancelable: false }
    );
  }

  function1(value) {
    if (value == "1") {
      var url = "XXXXX";
    } else {
      var url = "YYYYY";
    }
    Linking.openURL(url);
  }

  render() {
    const valueNb = navigation.getParam("valNb", "1");
    return (
      <View>
        <Button onPress={this.alertFunction} title="qwerty" color="#ffffff" />
      </View>
    );
  }
}