用vue·js的知识来完成请使用提供的素材文件，要求在输入【课程名称】、【课程内容】、【学习地点】之后，点击【添加】按钮，能够将新的学习计划添加到计划礼拜中。具体代码

要在Vue.js中实现这个功能，你需要创建一个简单的单页面应用，这里提供一个基础的步骤和代码示例。首先，确保安装了Vue CLI和必要的依赖。以下是一个基本的Vue组件结构，我们将使用`v-model`绑定表单输入，并监听`addCourse`事件来添加新的学习计划。

1. 安装Vue CLI（如果你还没有安装）：

npm install -g @vue/cli

2. 创建一个新的Vue项目：

vue create vue-course-plan-app
cd vue-course-plan-app

3. 进入项目目录并打开`src/App.vue`文件：

<template>
  <div id="app">
    <h1>课程计划</h1>
    <form @submit.prevent="addCourse">
      <label for="courseName">课程名称:</label>
      <input type="text" v-model="newCourse.courseName" id="courseName" required>

      <label for="courseContent">课程内容:</label>
      <input type="text" v-model="newCourse.courseContent" id="courseContent" required>

      <label for="learningLocation">学习地点:</label>
      <input type="text" v-model="newCourse.learningLocation" id="learningLocation" required>

      <button type="submit">添加</button>
    </form>
    <ul>
      <li v-for="(course, index) in courses" :key="index">
        {{ course.courseName }} - {{ course.courseContent }} - {{ course.learningLocation }}
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      newCourse: { courseName: '', courseContent: '', learningLocation: '' },
      courses: [],
    };
  },
  methods: {
    addCourse() {
      this.courses.push({ ...this.newCourse });
      this.newCourse = { courseName: '', courseContent: '', learningLocation: '' };
    },
  },
};
</script>

在这个例子中，我们使用`data`属性定义了初始数据，包括一个空的学习计划对象数组`courses`。`methods`里有一个`addCourse`方法，当用户点击“添加”按钮时，会复制当前`newCourse`对象并将其推入`courses`数组，然后清空`newCourse`以便继续添加新课程。

注意这是一个非常基础的例子，实际应用中可能需要添加验证、错误处理以及更复杂的表单状态管理。此外，样式和前端框架（如Vuetify或Element Plus）也是可以添加的。