javascript - ReactJS：当它是材料ui自动完成中的长文本时如何修剪标签

Question

我正在使用材质 UI 自动完成...当标签是长文本时，我想修剪它。

    <Autocomplete
      id="combo-box-demo"
      options={top100Films}
      getOptionLabel={(option) => option.title}
      style={{ width: 300 }}
      renderInput={(params) => 
      <TextField {...params} label="This is very long 
      labellllllllllllllllllllllllllllllllllllllllllll" variant="outlined" />}
    />

标签： javascriptreactjsecmascript-6material-uifrontend

Answer 1

您可以使用该功能substring()。

该方法返回开始和结束索引之间的字符串部分，或者返回到字符串的末尾。

const str = 'labelllllllllllll';

console.log(str.substring(0, 6));
// expected output: "label"

console.log(str.substring(2));
// expected output: "bel"

然后在您的文本字段中，您可以使用：

label={str.substring(0, 6)}