Функция React Native onPress продолжает вызывать - PullRequest
Новая
       71

Функция React Native onPress продолжает вызывать

1 голос
/ 04 августа 2020

Я пытаюсь запустить функцию в react native, где функция вызывается при нажатии кнопки, но при нажатии кнопки, когда функция продолжает работать снова и снова. Как исправить код, чтобы этого не произошло. Функция add_password - это функция, которая постоянно вызывается 

function DetailsScreen({ navigation, route }) {
  const [text3, setText3] = useState("");
  const [text4, setText4] = useState("");
  const { param1, param2 } = route.params;

  let button_click = () => {
    add_password(text3, text4, param1, param2);
  };

  return (
    <View style={{ flex: 1, alignItems: "center", justifyContent: "center" }}>
      <TextInput
        style={{ height: 40 }}
        placeholder="info"
        onChangeText={(text3) => setText3(text3)}
        defaultValue={text3}
      />
      <TextInput
        style={{ height: 40 }}
        placeholder="password"
        onChangeText={(text4) => setText4(text4)}
        defaultValue={text4}
      />
      <Button title="Add Password" onPress={button_click} />
    </View>
  );
}

1 Ответ

0 голосов
/ 04 августа 2020

Ciao, я получил ваш код из репозитория github, а затем, чтобы проверить его, я использовал response-native-expo-gitpod . Это просто пустой проект, который можно запустить на gitpod. Затем я вставил ваш код из репозитория github в приложение js и запустил его. Я сделал логин в HomeScreen:

enter image description here

Then I filled Details info and password fields:

enter image description here

Then I clicked Add Password button. And the result was that button_click function is called just one time!

This is DetailsScreen code:

function DetailsScreen({ navigation, route }) {
  const [text3, setText3] = useState("");
  const [text4, setText4] = useState("");
  const { param1, param2 } = route.params;

  const button_click = () => {
      console.log("button_click");
    add_password(text3, text4, param1, param2);
  };

  return (
    
       setText3(text3)}
        defaultValue={text3}
      />
       setText4(text4)}
        defaultValue={text4}
      />

Exactly like yours (except the log to check how many times function is called).

The log I received is:

введите описание изображения здесь

calling add_password - это еще один журнал, который я вставил в функцию add_password.

Кажется, все работает хорошо!

Примечание: это мой package.json: 

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start -c --host tunnel",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject",
    "test": "jest --watchAll"
  },
  "jest": {
    "preset": "jest-expo"
  },
  "dependencies": {
    "@expo/samples": "~3.0.3",
    "@expo/vector-icons": "^10.0.3",
    "@react-native-community/masked-view": "^0.1.10",
    "@react-navigation/native": "^5.7.3",
    "@react-navigation/stack": "^5.9.0",
    "@react-navigation/web": "^1.0.0-alpha.9",
    "expo": "^35.0.0",
    "expo-asset": "^7.0.0",
    "expo-constants": "^7.0.0",
    "expo-font": "^7.0.0",
    "expo-web-browser": "^7.0.0",
    "firebase": "^7.17.2",
    "react": "16.8.3",
    "react-dom": "16.8.3",
    "react-native": "https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz",
    "react-native-gesture-handler": "~1.3.0",
    "react-native-safe-area-context": "^0.3.6",
    "react-native-screens": "^2.10.1",
    "react-native-web": "^0.11.7",
    "react-navigation": "^3.12.0"
  },
  "devDependencies": {
    "babel-preset-expo": "^7.0.0",
    "jest-expo": "^35.0.0"
  },
  "private": true
}
...