如何根据以下条件将变量从loginform传递到app.js，并使用react js移动到下一个屏幕

在React.js中，可以通过props将变量从一个组件传递到另一个组件。要根据以下条件将变量从loginform组件传递到app.js组件，并移动到下一个屏幕，可以按照以下步骤进行操作：

在loginform组件中，定义一个state来存储要传递的变量。例如，假设要传递的变量名为"username"，可以在loginform组件的构造函数中初始化state：

constructor(props) {
  super(props);
  this.state = {
    username: ''
  };
}

在loginform组件中，创建一个输入框或其他表单元素，用于用户输入变量的值。通过onChange事件监听用户输入，并更新state中的变量值：

<input type="text" value={this.state.username} onChange={this.handleUsernameChange} />

在loginform组件中，定义一个事件处理函数handleUsernameChange，用于更新state中的变量值：

handleUsernameChange = (event) => {
  this.setState({ username: event.target.value });
}

在loginform组件中，创建一个按钮或其他触发事件的元素，用于在用户输入完成后触发传递变量的操作。通过onClick事件调用一个传递函数：

<button onClick={this.handleVariablePassing}>下一步</button>

在loginform组件中，定义一个传递函数handleVariablePassing，用于将state中的变量传递给app.js组件。可以通过props将变量传递给app.js组件：

handleVariablePassing = () => {
  this.props.history.push('/nextscreen', { username: this.state.username });
}

在app.js组件中，接收传递的变量。可以通过props.location.state获取传递的变量：

render() {
  const { username } = this.props.location.state;
  return (
    <div>
      <h1>Welcome to the next screen, {username}!</h1>
    </div>
  );
}

通过以上步骤，你可以根据条件将变量从loginform组件传递到app.js组件，并在下一个屏幕中使用该变量。请注意，上述代码中的"/nextscreen"是下一个屏幕的路由路径，你需要根据实际情况进行修改。

此外，如果你想了解更多关于React.js的相关知识和腾讯云的产品，可以参考以下链接：

React.js官方文档：https://reactjs.org/
腾讯云Serverless Cloud Function（SCF）：https://cloud.tencent.com/product/scf
腾讯云云开发（CloudBase）：https://cloud.tencent.com/product/tcb
腾讯云云函数（Cloud Function）：https://cloud.tencent.com/product/cos
腾讯云云数据库MongoDB（TencentDB for MongoDB）：https://cloud.tencent.com/product/mongodb
腾讯云云存储（COS）：https://cloud.tencent.com/product/cos
腾讯云区块链服务（Tencent Blockchain as a Service）：https://cloud.tencent.com/product/baas
腾讯云物联网开发平台（IoT Explorer）：https://cloud.tencent.com/product/iothub
腾讯云移动推送（TPNS）：https://cloud.tencent.com/product/tpns