无法从反应挂钩状态中获取值答案

【问题标题】：Unable to get values from react hook state无法从反应挂钩状态中获取值
【发布时间】：2019-11-11 13:10:03
【问题描述】：

我是反应原生和钩子的新手。在我的项目中，我声明了两个状态属性，我想将它们放入一个函数中。但我没有从钩子属性中获取值。在控制台中它正在写入 [object object]

const Login =()=> {
  const [username, setUserName] = React.useState('');
  const [password, setPassword] = React.useState('');

  callAPI = async ()=>{
    console.log('api called :' + username)
  }
}

【问题讨论】：

你在某处打电话给setUserName吗？
您可能想直接使用console.log(username); 来查看对象的实际情况。
你怎么称呼 setUserName ？
您的代码似乎不完整，请添加整个 sn-p
您的代码中可能还有其他问题，我在 stackblitz stackblitz.com/edit/react-hmomr2 中尝试了您的代码，并且运行良好

标签： reactjs react-native react-hooks

【解决方案1】：

这是您尝试完成的工作示例。

function mockAPI(username,password) {
  return new Promise((resolve,reject) => {
    setTimeout(()=>resolve(`The API received username: ${username} and pwd: ${password}`),1000);
  });
}

function App() {
  
  const [username, setUsername] = React.useState('');
  const [password, setPassword] = React.useState('');
  
  function callMockAPI(user,pwd) {
    mockAPI(user,pwd)
    .then((result)=>console.log(result));
  }
  
  return(
    <React.Fragment>
      <div>
        Username: <input type='text' value={username} onChange={()=>setUsername(event.target.value)}/>
      </div>
      <div>
        Password: <input type='password' value={password} onChange={()=>setPassword(event.target.value)}/>
      </div>
      <div>
        <button onClick={()=>callMockAPI(username,password)}>Submit</button>
      </div>
    </React.Fragment>
  );

}

ReactDOM.render(<App/>, document.getElementById('root'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.8.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.8.3/umd/react-dom.production.min.js"></script>
<div id="root"/>

【讨论】：

【解决方案2】：

得到解决方案我在这一行上犯了一个错误 onChange={()=>setPassword(event.target.value)}

现在这行解决了

onChangeText={text => setPassword(text)}

【讨论】：