<h4 id="source" onclick="showSource(${item.foeSysIdFrom})" style="cursor: pointer;">${item.companyName}</<h4> 如何显示居中

为了将 `<h4>` 标签的内容居中显示，你可以使用 CSS 的 `text-align` 属性。首先，你需要确定你的 HTML 结构中的父元素有合适的样式来控制其子元素的布局。假设 `<h4>` 标签的父元素是一个 `<div>` 元素，那么你可以通过为父元素添加适当的 CSS 来实现居中效果。

下面是一个可能的 CSS 样式：

.center-div {
    position: relative;
    text-align: center;
}

在这个样式中，我们给父元素 `.center-div` 添加了 `position: relative;` 属性，这是为了后续使用绝对定位来将子元素居中。然后我们设置了 `text-align: center;` 来将子元素的内容居中。

然后，在你的 HTML 中，将 `<h4>` 标签放在 `.center-div` 中，例如：

<div class="center-div">
    <h4 id="source" onclick="showSource(${item.foeSysIdFrom})" style="cursor: pointer;">${item.companyName}</<h4>
</div>

这将确保 `<h4>` 标签的内容在父元素中居中显示。注意，这个解决方案假设你的父元素已经有了足够的宽度和高度来容纳子元素。如果父元素的宽度和高度不足以容纳子元素，你可能需要调整父元素的样式或者添加额外的 CSS 来解决这个问题。

另外，关于 `onclick` 事件的处理，通常我们建议使用 JavaScript 或者其他前端框架来实现更复杂的功能，而不是直接在 HTML 中使用 `onclick` 属性。因为这样可能会导致代码难以维护和扩展。你可以尝试使用 JavaScript 或者 Vue.js、React.js 等前端框架来实现更灵活和强大的功能。