在pycharm中开发vue的方法步骤

'''
webstorm(vue) pycharm(python) goland(Go语言) idea(java) andrioStuidio(安卓) Php(PHP)
'''

'''
①在pycharm中打开vue项目,在settins下Plugins中下载vue.js
②启动vue项目
 -方法1.在Terminal下输入npm run serve
 -方法2.Edit Configurations----》点+ 选npm-----》在script对应的框中写：serve
'''

-node_modules：项目的依赖

-public
  -favicon.ico 网页的图标
  -index.html  主页面
-src：我们需要关注的
  -assets：方静态文件
  -components：小组件
  -views ：页面组件
  -App.vue ：主组件
  -main.js ：项目主入口js
  -router.js： 路由相关，以后配置路由，都在这里配置
  -store.js ：vuex相关，状态管理器

-package.json  项目的依赖文件

  import FreeCourse from './views/FreeCourse.vue'
  
  {
   path: '/freecourse',
   name: 'freecourse',
   component: FreeCourse
  },

免费课程

  {{course_list}}

export default {
 name: 'course',
 data: function () {
   return{
    course_list:['python','linux','go语言']
   }
 }
}

  //导入 axios
  import axios from 'axios'
  //把axios对象赋给$http
  Vue.prototype.$http=axios
  //以后在组件的js中通过$http取到的就是axios

  this.$http.request({
    //向下面的地址发送get请求
    url:'http://127.0.0.1:8000/courses/',
    method:'get'
  }).then(function (response) {
    //response.data才是真正的数据
    console.log(response.data)
  })

  mounted:function () {
    this.init()
  }
    

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);

# 不会在数据库中生成字段，只用于数据库操作
policy = GenericRelation(to='PricePolicy')

# 不会在数据库中生成字段，只用于数据库操作
policy = GenericRelation(to='PricePolicy')

#之前有的字段该怎么写就怎么写
object_id = models.IntegerField()
content_type = models.ForeignKey(to=ContenType,null=True)
# 引入一个字段，不会在数据库中创建，只用来做数据库操作
content_obj = GenericForeignKey()

course = models.Course.objects.get(pk=1)
ret=models.PricePolicy.objects.create(period=30, price=199.9,content_obj=course)

degree_course = models.DegreeCourse.objects.get(pk=1)
ret=models.PricePolicy.objects.create(period=30, price=199.9,content_obj=degree_course)

price_policy=models.PricePolicy.objects.get(pk=1)
print(price_policy.content_obj)

course = models.Course.objects.get(pk=1)
policy_list=course.policy.all()