React native 如何在react原生表单验证中以编程方式在函数组件中设置文本中的文本？

如果手机和密码字段为空，我想显示一条错误消息

这是我的密码：

import React, { useState } from 'react';

export const login = (m, p) => {

  if (m == "" || p == "") {
     setMessage('mobile & password both are required')
     return false;
  } else 
  {
      return true;
  }
}
 const App: () => React$Node = () => {

   const [mobile, setMobile] = useState('');
   const [pass, setPass] = useState('');
   const [errorMessage, setMessage] = useState('');

   return (
     <>
        <Text style={{ marginTop: 150 }}>
            { errorMessage }
        </Text>
        <TextInput
          onChangeText={mobile => setMobile(mobile)}
          defaultValue={mobile} />

        <TextInput 
          onChangeText={pass => setPass(pass)}
          defaultValue={pass} />

        <Button
            title="Login"
            onPress={() => {login(mobile,pass)}}
        />
     </>
   );
  };

---

有人可以帮忙吗。

您正在从hook函数外部调用

login（）函数。而且，
setMessage
不可用外部挂钩功能应用程序

你可以这样做：

import React, { useState } from 'react';


 const App: () => React$Node = () => {

   const [mobile, setMobile] = useState('');
   const [pass, setPass] = useState('');
   const [errorMessage, setMessage] = useState('');

   const login = (m, p) => {

     if (m == "" || p == "") {
        setMessage('mobile & password both are required')
        return false;
     } else {
      return true;
     }
   }

   return (
     <>
        <Text style={{ marginTop: 150 }}>
            { errorMessage }
        </Text>
        <TextInput
          onChangeText={mobile => setMobile(mobile)}
          defaultValue={mobile} />

        <TextInput 
          onChangeText={pass => setPass(pass)}
          defaultValue={pass} />

        <Button
            title="Login"
            onPress={() => {login(mobile,pass)}}
        />
     </>
   );
 };

export default App;

<Button
     title="Login"
     onPress={() => {login(mobile, pass, setMessage)}}
/>

如果出于某种原因需要将
login（）
保持在外部，则可以使用以下方法：

export const login = (m, p, setMessage) => { 
   if (m == "" || p == "") {
     setMessage('mobile & password both are required')
     return false;
   } else {
     return true;
   }
}

然后，在调用
登录功能时
传递
设置消息
，如下所示：

import React, { useState } from 'react';


 const App: () => React$Node = () => {

   const [mobile, setMobile] = useState('');
   const [pass, setPass] = useState('');
   const [errorMessage, setMessage] = useState('');

   const login = (m, p) => {

     if (m == "" || p == "") {
        setMessage('mobile & password both are required')
        return false;
     } else {
      return true;
     }
   }

   return (
     <>
        <Text style={{ marginTop: 150 }}>
            { errorMessage }
        </Text>
        <TextInput
          onChangeText={mobile => setMobile(mobile)}
          defaultValue={mobile} />

        <TextInput 
          onChangeText={pass => setPass(pass)}
          defaultValue={pass} />

        <Button
            title="Login"
            onPress={() => {login(mobile,pass)}}
        />
     </>
   );
 };

export default App;

<Button
     title="Login"
     onPress={() => {login(mobile, pass, setMessage)}}
/>

{login（mobile、pass、setMessage）}
/>
我想要一个不同的解决方案，因为我想进行
导出常量登录..
的jest测试。@BoidurjaTalukdar，请再次查看我的答案，请将其添加并标记为已解决。谢谢