小编Cma*_*ter的帖子

有人可以用外行的术语向我解释 FormControl 提供什么功能，以及为什么/如何使用它？

我在 React 中使用 Material-UI，我看到的许多表单示例都使用了 FormControl，但我很难理解它的作用，以及我的项目是否有必要。

现在我只有一个名为 Form.js 的组件，我将所有表单元素包含在一个 div 中，如下所示：

return (
<div>
  <FormControl className={classes.formControl}>
    <InputLabel htmlFor="select-multiple-accounts">Account</InputLabel>
    <Select
      multiple
      value={accountName}
      onChange={handleAccountChange}
      input={<Input id="select-multiple-accounts" />}
      renderValue={
        selected => (
        <div className={classes.chips}>
          {
            selected.map(value => (
            <Chip key={value} label={value} className={classes.chip} />
          ))}
        </div>
      )}
      MenuProps={MenuProps}
    >
      {accountNames.map(name => (
        <MenuItem key={name.label} value={name.label} style={getStyles(name.label, accountName, theme)}>
          {name.label}
        </MenuItem>
      ))}
    </Select>
  </FormControl>
  <br /><br />
  <TextField
    id="job-number"
    label="Job #"
    className={classes.textField}
    value={props.jobNumber}
    onChange={handleJobNumberChange}
    fullWidth
  />
  <br /><br /><br />
  <TextField
    id="project-description"
    label="Project …

我写了一个组件，它应该列出一堆带有相应文本字段的复选框。当您单击复选框或在字段中键入时，它意味着更新状态。

文本框工作正常，但是当我在字段中输入时，它会更新状态正常，但是每当我点击键盘时我都会失去焦点。

我意识到这可能是由于没有设置键，所以我为所有内容添加了键，但它仍然失去焦点。有一次我尝试在我的事件中添加 stopPropegation 因为我认为这可能会导致问题？我不确定......仍在学习......似乎没有用，所以我也删除了那部分。

似乎仍然无法弄清楚是什么导致它失去焦点......有没有人对这个问题有任何建议/解决方案？

我整合了我的代码并删除了不必要的部分以使其更易于阅读。有3个相关的JS文件..请看下面：

我仍然是初学者/学习者，所以如果您有与此代码的任何部分相关的有用建议，请随时提供。谢谢！

应用程序.js

import React, { Component } from 'react';
import Form from './Form'

class App extends Component {
constructor() {
  super();
  this.state = {
      mediaDeliverables: [
        {label: 'badf', checked: false, quantity:''},
        {label: 'adfadf', checked: false, quantity:''},
        {label: 'adadf', checked: false, quantity:''},
        {label: 'addadf', checked: false, quantity:''},
        {label: 'adfdes', checked: false, quantity:''},
        {label: 'hghdgs', checked: false, quantity:''},
        {label: 'srtnf', checked: false, quantity:''},
        {label: 'xfthd', checked: false, quantity:''},
        {label: 'sbnhrr', checked: false, quantity:''},
        {label: 'sfghhh', …

我正在使用React 360进行一些测试,目前我唯一拥有的硬件是Google Cardboard.我在iOS上使用VR浏览器查看我上传的内容并且它正在工作,但是立体图像看起来相距太远导致"看到双重"效果.canvas对象似乎也没有扩展"VR Browser"应用程序的整个宽度.每侧似乎都有白色边框.

我似乎找不到任何关于如何在React 360代码中调整图像以适应我的Cardboard查看器镜头距离的文档.

如何配置它才能工作？有没有办法调整这些问题？