材质UI文本字段打印不正确

Question

我正在尝试使用window.print()打印react app的页面。一切都可以正确打印，但不能正确打印文本字段（从Material UI）。当我没有太多的文本行时，它可以工作。但是当我写很多文本时，它看起来像这样（打印预览）：

这是代码：

 <form autoComplete="off" className="subsection">
    <TextField
      error={controlHasError(
        props.errors,
        'MetodyWyceny',
        props.data.MetodyWyceny,
      )}
      name="MetodyWyceny"
      label="Opis"
      multiline
      variant="outlined"
      title={props.data.MetodyWyceny}
      defaultValue={props.data.MetodyWyceny}
      onBlur={(e) => props.onSetSectionData('MetodyWyceny', e.target.value)}
    />
  </form>

  .subsection {
    width: 100%;
    display: grid;
  }

我有这段代码可以样式化textareas（多行Textfield实际上是textarea）：

  textarea {
    overflow: hidden;
    pointer-events: none;
  }

那么，我该怎么做才能正确打印此组件？ 谢谢。

Answer 1

您的用法或TextField https://material-ui.com/api/text-field/中存在错误。它没有“ title”道具。

通过记录

验证props.data.MetodyWyceny，并查看它是否有任何前导空格。 我的意思是您设置的默认值本身在实际内容之前可能有很多空格，这是您输出的唯一解释