Flutter使用multiselect包时列表转字符串如何去除方括号展示

Dart 中List<String>类型默认调用toString()方法时会自动带上前后方括号，你只需要调用列表自带的join()方法，即可实现逗号分隔的无括号展示效果。

代码修改 #

将DataCell内Text组件的传入内容替换为selected.join(',')即可，修改后完整代码如下：

List<String> selected = [];

child: DropDownMultiSelect(
  onChanged: (List<String> x) {
    setState(() {
      selected = x;
    });
  },
  options: ['S', 'M', 'L', 'XL'],
  selectedValues: selected,
  whenEmpty: 'Select Size',
),

DataCell(Text(
  // 核心修改：用join方法以逗号为分隔符拼接列表所有元素
  selected.join(','),
  style: const TextStyle(
    color: Colors.white,
    fontSize: 25.0,
  ),
)),

可选优化 #

• join()方法支持自定义分隔符，如果你需要逗号加空格的展示样式，直接改为selected.join(', ')即可
• 空选状态下join()会返回空字符串，如果你希望空选时展示默认提示，可以修改为selected.isEmpty ? '请选择尺码' : selected.join(',')

内容的提问来源于stack exchange，提问作者Dren