本机反应:如何禁用按钮？

Question

我现在在我的帖子页面上有一个按钮。如果当前用户id与post用户id相等，我希望禁用此按钮。

我在用Formik来管理我的州。

AppButton.js

 function AppButton({ title, onPress}) {
 return (
 <TouchableOpacity style={[styles.button]} onPress={onPress}>
  <Text style={styles.text}>{title}</Text>
</TouchableOpacity>
);
}

SubmitButton.js

import { useFormikContext } from "formik";

function SubmitButton({ title }) {
const { handleSubmit } = useFormikContext();
return <AppButton title={title} onPress={handleSubmit}/>;
}

Form.js

function MessageForm({ post,user }) {
return(
<SubmitButton title="Message"/>

PostScreen.js

function PostScreen({ route }) {
const post = route.params.post;
const { user } = useAuth();

clg(user.id) // this prints the id of the current user
clg(post.userId) / /this prints the userId of the post

return(
<Form post={post}/>

Answer 1

这可能会有帮助

<SubmitButton title="Message" disabled={user.id === post.userId} />

function SubmitButton({ title, disabled }) {
  const { handleSubmit } = useFormikContext();
  return <AppButton title={title} onPress={handleSubmit} disabled={disabled}/>;
}

function AppButton({ title, onPress, disabled}) {
 return (
   <TouchableOpacity style={[styles.button]} onPress={onPress} disabled={disabled} >
     <Text style={styles.text}>{title}</Text>
  </TouchableOpacity>
 );
}