在react Native中禁用带有条件的按钮

import React, { useState } from 'react';
import { Button } from 'react-native';

const MyButton = () => {
  const [isButtonDisabled, setButtonDisabled] = useState(false);

  const handleButtonPress = () => {
    // 处理按钮点击事件
  };

  return (
    <Button
      title="按钮"
      disabled={isButtonDisabled}
      onPress={handleButtonPress}
    />
  );
};

export default MyButton;

import React, { useState, useEffect } from 'react';
import { Button } from 'react-native';

const MyButton = () => {
  const [isButtonDisabled, setButtonDisabled] = useState(false);
  const [condition, setCondition] = useState(false);

  useEffect(() => {
    setButtonDisabled(condition);
  }, [condition]);

  const handleButtonPress = () => {
    // 处理按钮点击事件
  };

  return (
    <Button
      title="按钮"
      disabled={isButtonDisabled}
      onPress={handleButtonPress}
    />
  );
};

export default MyButton;

import React, { useState } from 'react';
import { View } from 'react-native';
import MyButton from './MyButton';

const App = () => {
  const [condition, setCondition] = useState(false);

  const toggleCondition = () => {
    setCondition(!condition);
  };

  return (
    <View>
      <MyButton />
      <Button title="切换条件" onPress={toggleCondition} />
    </View>
  );
};

export default App;