目录
1.写在前面
1.1.需要准备的软件
(1)pycharm(用来写后端Django)
(2)DevEco studio(用来写前端)
(3)mysql msi(用来直观的查看数据库,其他修改数据库方式也行)
1.2.需要了解的知识
(1)django基础(app文件的创建,路由配置,连接数据库等)
(2)前端基础(会写一个简单的页面,会简单的逻辑js代码)
(3)对数据库的操作(这里使用的是ORM模型)
(4)了解json格式以及相关操作
2.前端
2.1.页面设计
首先设计一个前端页面
<div class="container">
<div class="body">
<div class="title">
<div class="txt">
<text>个人信息</text>
</div>
</div>
<div class="name">
<div class="txt">
<text>姓名:{{information[0].name}}</text>
</div>
</div>
<div class="age">
<div class="txt">
<text>年龄:{{information[0].age}}</text>
</div>
</div>
<div class="tel">
<div class="txt">
<text>电话:{{information[0].tel}}</text>
</div>
</div>
<div class="refresh" onclick="OnClick">
<div class="txt">
<text>刷新</text>
</div>
</div>
</div>
</div>
2.2.页面效果
2.3.后端js逻辑
import fetch from '@system.fetch';
import qs from "querystring"
export default {
data: {
myText:"",
//用来向前端展示数据
information:[
{name:"abc",age:'13',tel:'15900000000'},
{name:"",age:'',tel:''}
]
},
OnClick: function(){
fetch.fetch({
url:'http://127.0.0.1:8000/resp/',//后端所在服务器地址
data:qs.stringify({'uid':'1'}),//请求验证信息
responseType:"json",
method:"POST",
success:(resp)=>{
var myData
myData = JSON.parse(resp.data)//将string转换为js对象
this.information[0].name = myData[0].name
this.information[0].age = myData[0].age
this.information[0].tel = myData[0].tel
console.log(typeof(myData))
},
fail:(resp)=> {
this.myText = resp.data
console.log("获取数据失败:" + this.myText)
}
})
}
}
这里对数据库操作使用的是ORM模型
需要注意的是后端传的数据是字符型, 前端要使用的话需要转换一下,JSON.parse可以将JSON格式的字符串(不是则不能用)转换为js对象(普通的字符串不能用),之后方便操作(如果你仅仅想要打印后端传的字符串,那就不用转换)。
3.后端
3.1.数据库内容
3.2.关键代码
import json
import requests
from .models import Person
from django.http import HttpResponse
from rest_framework.views import APIView
class Appresp(APIView):
def post(self, request):
db = Person.objects.filter(name='lili').last()
uid = request.data.get("uid")
arr = []
content = {'name': db.name, 'age': db.age, 'tel': db.tel}
arr.append(content)
arr = json.dumps(arr,ensure_ascii=False)
return HttpResponse(arr)
后端代码用来取数据库中名字是‘lili’的最后一条数据。 如果去掉filter或者去掉filter中的内容,那么取的数据就是数据库最后一条数据。json.dumps用来将python对象转换为json格式的字符串。
4.前端展示
(1)filter内有筛选条件lili,由于名叫lili的只有一个,所以只有那一个在前端展示否则会展示最后一个‘lili’
(2)没有filter,展示数据库最后一个成员