嵌套v-仅显示Vue中第一个元素的最后一个子元素

<div v-仅显示>
  <p>第一个元素的第一个子元素</p>
  <p>第一个元素的第二个子元素</p>
  <p>第一个元素的最后一个子元素</p>
</div>

Vue.directive('仅显示', {
  inserted: function (el) {
    // 获取第一个元素
    const firstElement = el.children[0];
    // 获取第一个元素的最后一个子元素
    const lastChild = firstElement.lastElementChild;
    // 隐藏其他子元素
    for (let i = 0; i < firstElement.children.length; i++) {
      if (firstElement.children[i] !== lastChild) {
        firstElement.children[i].style.display = 'none';
      }
    }
  }
});