mounted:function () {
this.init()
}组件
<template>
<div class="course">
<h1>我是免费课程页面</h1>
<p v-for="course in course_list">{{course}}</p>
</div>
</template><script>
export default {
name: 'course',
data: function () {
return{
course_list:[] }
},
methods: {
'init':function () {
var _this = this;
this.$http.request({
//向下面的地址发送get请求
url:'http://127.0.0.1:8000/courses/',
method:'get'
}).then(function (response) {
//response.data才是真正的数据
_this.course_list = response.data
})
}
} ,
mounted:function () {
this.init()
}
}
</script>
七.vue中使用element-ui
-饿了么开源样式
-安装 npm i element-ui -S
-在main.js中配置
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);
-去官方文档看样式完成复制粘贴 http://element-cn.eleme.io/#/zh-CN
八.contentype组件(数据库相关)
什么时候使用?
实际项目中有一个表(PricePolicy)要关联好几个表(Course,DegreeCourse)也就是这个表要储存好几个表的数据,这种情况使用contentype组件
-新建免费课程表的时候 Course
# 不会在数据库中生成字段，只用于数据库操作
policy = GenericRelation(to='PricePolicy')
-新建学位课程表的时候 DegreeCourse
# 不会在数据库中生成字段，只用于数据库操作
policy = GenericRelation(to='PricePolicy')
-价格策略表 PricePolicy
#之前有的字段该怎么写就怎么写
object_id = models.IntegerField()
content_type = models.ForeignKey(to=ContenType,null=True)
# 引入一个字段，不会在数据库中创建，只用来做数据库操作
content_obj = GenericForeignKey()
使用一（给课程添加价格策略）：
-给免费课django添加价格策略
course = models.Course.objects.get(pk=1)
ret=models.PricePolicy.objects.create(period=30, price=199.9,content_obj=course)
-给学位课程（python全栈开发）添加价格策略
degree_course = models.DegreeCourse.objects.get(pk=1)
ret=models.PricePolicy.objects.create(period=30, price=199.9,content_obj=degree_course)
