监听回车键，当按下回车键时，将文本框中的内容添加到列表中

为了实现监听回车键并在按下回车键时将文本框中的内容添加到列表中，你需要在 `Content.vue` 组件中进行如下操作：

1. **绑定输入框的值**：使用 `v-model` 将输入框的值绑定到一个数据属性。
2. **监听键盘事件**：使用 `@keyup` 事件监听器来检测回车键的按下。
3. **处理回车键事件**：在方法中将输入框的内容添加到列表中，并清空输入框。

以下是一个示例代码：

### Content.vue

<template>
  <div>
    <input type="text" v-model="newItem" @keyup.enter="addItem" placeholder="输入待办事项">
    <ul>
      <li v-for="(item, index) in items" :key="index">{{ item }}</li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      newItem: '',  // 输入框的值
      items: []     // 列表项数组
    };
  },
  methods: {
    addItem() {
      if (this.newItem.trim()) {
        this.items.push(this.newItem);
        this.newItem = '';  // 清空输入框
      }
    }
  }
};
</script>

<style scoped>
/* 添加一些样式以提高可读性 */
input {
  width: 100%;
  padding: 8px;
  margin-bottom: 10px;
}
ul {
  list-style-type: none;
  padding: 0;
}
li {
  padding: 5px;
  border-bottom: 1px solid #ccc;
}
</style>

### App.vue

<template>
  <div id="app">
    <Content />
  </div>
</template>

<script>
import Content from './components/Content.vue';

export default {
  components: {
    Content
  }
};
</script>

<style>
/* 全局样式 */
body {
  font-family: Arial, sans-serif;
}
</style>

这样，当你在输入框中输入内容并按下回车键时，输入的内容将会被添加到列表中，并且输入框会被清空。