如何将LeadingIconButton或TrailingIconButton与输入放置在同一行？

Question

我在材质表的detailPanel内部有一个带有输入的React TextField，用于与行关联的注释。我包含了一个railingIconButton作为保存按钮，它出现在文本输入下方。 trailingIconButton

如果我将其更改为LeadingIconButton，它将显示在上面的行中。 leadingIconButton

是否可以将按钮与文本字段放在同一行？我想要一个LeadingIconButton，它直接位于文本字段旁边，因此占用的空间更少。

无法调整输入或文本字段的宽度。

这就是我当前的detailPanel外观

detailPanel={[{
            tooltip: 'Notes',
            render:rowData => {
            return <div>
        <TextField
          // helperText={<HelperText>Save</HelperText>}
          onLeadingIconSelect={() => {this.putNotes(rowData)}}
          leadingIcon={<MaterialIcon aria-label="Save" role="button" icon="done" hasRipple={true}/>}
        ><Input
            // disableUnderline={ true }
            value={ rowData['notes'] }
            onChange={(e) => this.setNotes(rowData, e.currentTarget.value)} />
        </TextField>
      </div>