vue组件

	跨域问题:
		-同源策略(浏览器的安全策略)
			-只允许当前页面朝当前域下发请求,如果向其他域发请求,请求可以正常发送,数据也可以拿回,但是被浏览器拦截了
		-cors:只要服务器实现了CORS,就可以实现跨域资源共享
			-简单请求
				-只发一次请求
			-非简单请求:
				-发两次请求:一次预检(OPTION请求),只有服务端允许发请求,才能继续发第二次正常请求,一次真正的请求
		-服务端如何处理:
			-写在中间件中:
				from django.utils.deprecation import MiddlewareMixin
				class MyCorsMiddle(MiddlewareMixin):
					def process_response(self,request,response):
						# 简单请求:
						# 允许http://127.0.0.1:8001域向我发请求
						# ret['Access-Control-Allow-Origin']='http://127.0.0.1:8001'
						# 允许所有人向我发请求
						response['Access-Control-Allow-Origin'] = '*'
						if request.method == 'OPTIONS':
							# 所有的头信息都允许
							response['Access-Control-Allow-Headers'] = '*'
						return response
			-在setting中配置中间件即可
													
	创建vue项目:
		-安装node.js
		-vue脚手架
		-vue create 项目名字
	pycharm开发vue项目
		-需要安装vue.js插件
			-setting--->plugins--->左下方install---->去搜索---->下载--->重启
		-运行vue项目
			-editconfigration--->+--->npm--->run serve 
			
	vue目录结构:
		-node_modules:项目依赖(以后项目要传到git上,这个不能传)
		-publish--->index.html  是总页面
		-src :项目
			-assets:静态资源
			-components:组件
			-views:视图组件
			-APP.vue:根组件
			-main.js :总的入口js
			-router.js :路由相关,所有路由的配置,在这里面
			-store.js  :vuex状态管理器
		-package.json:项目的依赖,npm install 是根据它来安装依赖的
	每个组件会有三部分:
		-template
		-style
		-script
	新建组件:
		-创建一个组件
		-去路由做配置:
		import Course from './views/Course.vue'
			{
			  path: '/course',
			  name: 'course',
			  component: Course
			}
		-使用:
			<router-link to="/course">专题课程</router-link>
	显示数据:
		-script中:
			  export default {
				data:function () {
					return{
					
						course:['python','linux'],
						aa:'我是aa'
					}
				}
	方法绑定:
		<button @click="init">点我</button>
		
		-script
			methods: {
				init: function () {
					alert('111')
				}
			}
	vue中的ajax:
		-axios
		-安装:npm install axios
		-使用:
			-先在main中配置:
				import axios from 'axios'
				Vue.prototype.$http=axios
			-在组件中:
				this.$http.request().then().catch()
				this.$http.request({
					url:请求的地址
					method:请求方式
				}).then(function(response){
					....函数回调处理
				})
			-注意:
				this需要在上面重新赋值给一个变量
				请求成功函数内部:
					_this.course=response.data