使用 v-html 动态插入 HTML 内容，并且需要在这些内容中的 标签前面加数字

<template>
  <div id="userSummary" v-html="dynamicHtml"></div>
</template>

<script>
export default {
  data() {
    return {
      dynamicHtml: '<p>Example text 1</p><p>Example text 2</p><p>Example text 3</p>'
    };
  },
  updated() {
    this.addNumbersToParagraphs();
  },
  methods: {
    addNumbersToParagraphs() {
      const userSummary = this.$el.querySelector('#userSummary');
      const paragraphs = userSummary.getElementsByTagName('p');

      for (let i = 0; i < paragraphs.length; i++) {
        if (!paragraphs[i].querySelector('span')) { // Avoid adding multiple numbers
          const number = document.createElement('span');
          number.textContent = (i + 1) + '. ';
          paragraphs[i].insertBefore(number, paragraphs[i].firstChild);
        }
      }
    }
  }
};
</script>