富阳做网站方式,网页设计软件html,广告公司品牌策划,神起网络游戏推广平台1. 发送ajax请求的方式
方案一#xff1a;jq 的ajax#xff08;在 vue 中不推荐同时使用#xff09;方案二#xff1a;js 原始官方 fetch方法方案三#xff1a;axios 第三方
2. 方案一
后端视图函数
from rest_framework.viewsets import ViewSet
from rest_framework…1. 发送ajax请求的方式
方案一jq 的ajax在 vue 中不推荐同时使用方案二js 原始官方 fetch方法方案三axios 第三方
2. 方案一
后端视图函数
from rest_framework.viewsets import ViewSet
from rest_framework.response import Responseclass Index(ViewSet):def index(self, request):res Response({name: xwx, age: 123})res[Access-Control-Allow-Origin] *return res
需要注意的是需要添加 Access-Control-Allow-Origin 在请求头
后端路由
from django.contrib import admin
from django.urls import path
from app01 import viewsurlpatterns [path(admin/, admin.site.urls),path(index/, views.Index.as_view({get: index})),
]
前端发送 Ajax
div idapppbutton clickfunc点我向后端发请求获取用户信息/button/pp用户名{{ name }}/pp年龄是{{ age }}/p
/divscriptnew Vue({el: #app,data: {name: ,age: ,},methods: {func() {$.ajax({url: http://127.0.0.1:8000/index/,type: get,success: data {console.log(data)this.name data.namethis.age data.age}})}},})
/script 3. 方案二
前端发送Ajax请求
div idapppbutton clickfunc点我向后端发请求获取用户信息/button/pp用户名{{ name }}/pp年龄是{{ age }}/p
/divscriptnew Vue({el: #app,data: {name: ,age: ,},methods: {func() {fetch(http://127.0.0.1:8000/index/).then(res res.json()).then(res {console.log(res)this.name res.namethis.age res.age})},}})
/script
4. 方案四
前端发送Ajax请求
div idapppbutton clickfunc点我向后端发请求获取用户信息/button/pp用户名{{ name }}/pp年龄是{{ age }}/p
/divscriptnew Vue({el: #app,data: {name: ,age: ,},methods: {func() {axios.get(http://127.0.0.1:8000/index/).then(res {console.log(res.data)this.name res.data.namethis.age res.data.age})},}})
/script
