我找到了一个变通方法，由@tmdesigned的答案引发，我将把它作为一个答案发布。这并不漂亮，我不认为这是一个“经典”的答案，但希望它能帮助我们实现这一目标。

首先，我使用source: children:

tabs: { 
  type: \'array\',
  source: \'children\',
  selector: \'ul.tabs\',
  default: []
}

这意味着在初始保存时，我处理的是一个字符串数组，但在编辑器中的后续加载时，我处理的是一个对象数组，因为我源类型的子对象是<li> 元素本身，而不是元素的文本值。

我的解决方案是映射这些元素并将它们转换回字符串数组。这必须在edit 功能和save 作用

const tabValues = tabs.map(tab => {
  if (typeof(tab) === \'object\')
    return tab.props.children[0];

  return tab;
});

后来在输出中，我可以这样输出：

{tabValues.map(tab => <li key={tab} className="tab">{tab}</li>)}

如果任何人有一个完全依赖于数据解析的解决方案，并且不需要这种变通方法，我会将其标记为答案。

当您将属性的源设置为子级时，它将为您提供DOM元素，即包括包装HTML而不仅仅是内部文本。

因此，您看到的行为（您可能已经知道）是HTML元素嵌套在其内部。你在把里面的东西包起来<li>, 它被包裹在<li>, 可能会被<li> 再次，等等。

那部分我很确定。下面的解决方案是我对如何操作的理解，但还没有完成这种类型的属性选择器，我还没有完全测试它。话虽如此，我认为您所寻找的更接近：

attributes: {
  tabs: { 
    type: \'array\',
    source: \'query\',
    selector: \'ul.tabs\',
    default: [],
    query: {
      val: {
        type: \'string\',
        selector: \'li\',
        source: \'text\',
    },
  }
}

因此，我们正在创建一个具有一个属性的对象数组，该属性来自每个子对象的文本。然后在save函数中，您必须特别地val 我们刚刚指定的属性来自li 选择器：

save({attributes, className}) {
  const { tabs, newTab, content } = attributes;

  return (
    <div className={className}>
      <span className="data-drop" newtab={newTab}></span>
      <ul className="tabs">
      {tabs.map(tab => {
            return <li className="tab">{tab.val}</li>;
        })}
      </ul>          
    </div>
  );
}