用户基本信息逻辑分析
以下是要实现的后端逻辑
- 用户模型补充email_active字段
- 查询并渲染用户基本信息
- 添加邮箱
- 发送邮箱验证邮件
- 验证邮箱
查询并渲染用户基本信息
用户模型补充email_active字段 - 由于在渲染用户基本信息时,需要渲染用户邮箱验证的状态,所以需要给用户模型补充email_active字段
- 补充完字段后,需要进行迁移。
python manage.py makemigrations
python manage.py migrate
查询用户基本信息
class UserInfoView(LoginRequiredMixin, View):
"""用户中心"""
def get(self, request):
"""提供个人信息界面"""
context = {
'username': request.user.username,
'mobile': request.user.mobile,
'email': request.user.email,
'email_active': request.user.email_active
}
return render(request, 'user_center_info.html', context=context)
django中的request对象详解:https://www.cnblogs.com/shangping/p/11602885.html
渲染用户基本信息
将后端模板数据传递到Vue.js
- 为了方便实现用户添加邮箱时的界面局部刷新
- 我们将后端提供的用户数据传入到user_center_info.js中
<script type="text/javascript">
let username = "{{ username }}";
let mobile = "{{ mobile }}";
let email = "{{ email }}";
let email_active = "{{ email_active }}";
</script>
<script type="text/javascript" src="{{ static('js/common.js') }}"></script>
<script type="text/javascript" src="{{ static('js/user_center_info.js') }}"></script>
Vue渲染用户基本信息:user_center_info.html
<li><span>用户名:</span>[[ username ]]</li>
<li><span>联系方式:</span>[[ mobile ]]</li>