如何在vueJS中滚动查看新添加的列表项

data() {
  return {
    items: []
  }
}

<ul>
  <li v-for="item in items" :key="item.id">{{ item.name }}</li>
</ul>

methods: {
  addItem() {
    const newItem = { id: this.items.length + 1, name: 'New Item' };
    this.items.push(newItem);
  }
}

<ul ref="listContainer">
  <li v-for="item in items" :key="item.id">{{ item.name }}</li>
</ul>

methods: {
  addItem() {
    const newItem = { id: this.items.length + 1, name: 'New Item' };
    this.items.push(newItem);
    this.$nextTick(() => {
      const container = this.$refs.listContainer;
      container.lastElementChild.scrollIntoView({ behavior: 'smooth' });
    });
  }
}