如何让滚动条从下往上滚动？

<template>
  <div class="content" ref="content">
    <p>Content 1</p>
    <p>Content 2</p>
    <p>Content 3</p>
  </div>
</template>

<script>
export default {
  mounted() {
    this.scrollToBottom();
  },
  methods: {
    scrollToBottom() {
      const content = this.$refs.content;
      content.scrollTop = content.scrollHeight;
    },
  },
};
</script>

<style>
.content {
  height: 300px; 
  overflow-y: auto;
  border: 1px solid #ccc;
}
</style>