django联系人列表前端展示,前端页面包含联系人搜索,查看全部联系人按钮,查看男性联系人按钮,刷新按钮,新增联系人按钮以及每个联系人都有头像,最后美化前端页面
时间: 2023-03-23 12:03:46 浏览: 37
您好!感谢您的提问。
对于您的需求,可以使用Django框架的视图(View)和模板(Template)来实现。
1. Django视图(View):您可以使用Django的视图函数来渲染前端页面并将需要展示的数据传递给前端。下面是一个示例:
```python
from django.shortcuts import render
from .models import Person
def index(request):
people = Person.objects.all()
return render(request, 'index.html', {'people': people})
```
在这个示例中,我们定义了一个名为`index`的视图函数,它会查询所有的`Person`对象,并将它们传递给名为`index.html`的模板。模板可以使用这些数据来渲染前端页面。
2. Django模板(Template):您可以使用Django的模板语言来设计前端页面,展示后端传递过来的数据。下面是一个示例:
```html
{% extends 'base.html' %}
{% block content %}
<h1>People</h1>
<form method="get">
<input type="text" name="search" placeholder="Search...">
<button type="submit">Search</button>
</form>
<ul>
{% for person in people %}
<li>{{ person.name }} - {{ person.gender }}</li>
{% empty %}
<li>No people found</li>
{% endfor %}
</ul>
{% endblock %}
```
在这个示例中,我们定义了一个模板`index.html`,它继承了一个名为`base.html`的基础模板,并且展示了所有的`Person`对象的姓名和性别。此外,我们还添加了一个搜索表单,让用户可以根据关键字搜索`Person`对象。
如果您想要添加其他功能,例如分页、排序、新增等,可以通过Django提供的视图函数和模板标签来实现。最后,为了美化前端页面,您可以使用CSS和JavaScript来设计页面样式和交互。