• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

React Native-problem

Aruba Cloud - Virtual Private Server VPS
0 głosów
190 wizyt
pytanie zadane 20 marca 2023 w JavaScript przez MacieKap Bywalec (2,400 p.)

Witam,

uczę się pisać w reakcie native.

Alert który powinien wyświetlić się po kliknięciu przycisku, wyświetla się zaraz po starcie aplikacji.

Jest w stanie ktoś pomódz?

Z góry dziękuję za wszystkie odpowiedzi.

import React from 'react';
import {Button, Alert, View, Text, StyleSheet, ScrollView, TouchableHighlight} from "react-native";
import {Component} from "react";

export default class App extends Component {
  _kliknieto() {
    Alert.alert('Kliknięto!');
  }

  render() {
    return (
    <ScrollView style={styles.maincontainer}>
        <TouchableHighlight onPress={this._kliknieto()} underlayColor='#white'>
          <View style={styles.btn}>
            <Text style={styles.btntext}>Kliknij Mnie!</Text>
          </View>
        </TouchableHighlight>
    </ScrollView>
    );
  }
}
const styles = StyleSheet.create({
  maincontainer: {
    padding: 15,
    paddingTop: 30,
    backgroundColor: '#fce7c7',
  },
  logo: {
    backgroundColor: '#2b2b2b',
    color: '#fff',
    padding: 25,
  },
  btn: {
    marginBottom: 15,
    borderRadius: 3,
    color: '#fff',
    padding: 5,
    height: 50,
    backgroundColor: '#bc8f8f',
    flex: 1,
    alignItems: "center",
    justifyContent: "center",
  },
  btntext: {
    textAlign: "center",
    color: '#fff',
    fontSize: 18,
  },
})

 

1 odpowiedź

+1 głos
odpowiedź 20 marca 2023 przez ScriptyChris Mędrzec (190,190 p.)

Do event handlerów zazwyczaj przekazuje się referencję funkcji (czyli samą jej nazwę), chyba, że dana funkcja sama zwraca inną funkcję. Wtedy nawiasy powodują, że od razu wołana jest pierwsza funkcja, która zwraca funkcję docelową i to ona jest przypisywana do handlera. U Ciebie natomiast jest zwykły przypadek.

Zamień więc

onPress={this._kliknieto()}

na

onPress={this._kliknieto} // bez nawiasów wywołujących funkcję

W razie problemów z this (typu "cannot read property _kliknieto of undefined") zastosuj bindowanie, albo owiń to w arrow function (wtedy już z nawiasami wołającymi funkcję):

  • onPress={this._kliknieto.bind(this)}
  • // args to najczęściej sam event, ale dla pewności można przekazać wszystkie argumenty
    onPress={(...args) => this._kliknieto(...args)}

     

 

Podobne pytania

0 głosów
0 odpowiedzi 146 wizyt
pytanie zadane 1 kwietnia 2023 w JavaScript przez DzikieHarce Użytkownik (690 p.)
0 głosów
0 odpowiedzi 793 wizyt
0 głosów
1 odpowiedź 284 wizyt
pytanie zadane 19 marca 2023 w JavaScript przez MacieKap Bywalec (2,400 p.)

93,331 zapytań

142,323 odpowiedzi

322,400 komentarzy

62,667 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj

Wprowadzenie do ITsec, tom 1 Wprowadzenie do ITsec, tom 2

Można już zamawiać dwa tomy książek o ITsec pt. "Wprowadzenie do bezpieczeństwa IT" - mamy dla Was kod: pasja (użyjcie go w koszyku), dzięki któremu uzyskamy aż 15% zniżki! Dziękujemy ekipie Sekuraka za fajny rabat dla naszej Społeczności!

...