Material UI - 在 TextField 中垂直顯示裝飾

Question

我試圖在材料 ui 文本字段中垂直顯示裝飾，但沒有運氣。 它總是水平放置。 有沒有辦法垂直顯示裝飾品？

代碼：

<TextField 
   variant="filled" 
   fullWidth 
   multiline 
   rowsMax={7}
   onFocus={() => handleInputFocus({})}
   onBlur={() => handleInputFocus({})}
   InputProps={{
   ...(isSelected ? { endAdornment:
   <InputAdornment position="start">
      <Box mb={3}>
         <SaveIcon color="primary" className={cursorStyle} onClick={() => deleteNote()} />
         <DeleteIcon className={cursorStyle} onClick={() => deleteNote()} />
      </Box>
    </InputAdornment> }: {})
  }}
/>

實際 Output：

Answer 1

使用 display flex，嘗試在 InputAdornment 行中添加style={{ display: 'flex', flexDirection: 'column'}}作為<InputAdornment position="start" style={{ display: 'flex', flexDirection: 'column'}}>

然后只需修復圖標的樣式。 因為他們可能會脫離盒子的界限。