已經完成了登入和注冊頁面已經
我的頁面的功能
當其他人檢視我的資訊,可以看到關注我,粉絲數量,關注數量,獲贊數量。
當使用者自己點選我的資訊,可以看到上傳視訊,登出登入,粉絲數量,關注數量,獲贊數量。
頁面的設計
![](https://img.laitimes.com/img/__Qf2AjLwojIjJCLyojI0JCLicmbw5SZ0QWO0ATN1cjY0MjY1IWZhhTOjJWNwM2NzYGNhJDZi9CX0JXZ252bj91Ztl2Lc52YucWbp5GZzNmLn9Gbi1yZtl2Lc9CX6MHc0RHaiojIsJye.png)
mine檔案内加入基本的小程式需要的元素
mine.wxml
mine.
// pages/mine/mine.js
Page({
/**
* 頁面的初始
mine.wxss
page {
font-size: 14px;
}
.container {
background-color: whitesmoke;
display: flex;
flex-direction: column;
align-items: center;
}
.container-row {
display: flex;
flex-direction: row;
margin-bottom: 10px;
margin-top: 10px;
}
.info-items {
margin-left: 30px;
}
.face {
width: 180rpx;
height: 180rpx;
border-radius: 50%;
margin-top: 20px;
}
.nickname {
margin-top: 5px;
font-weight: bold;
font-size: 18px;
}
.logout {
margin-top: 3px;
float: right;
}
.follow {
margin-top: 3px;
}
.line {
width: 100%;
height: 1px;
background-color: gainsboro;
margin-top: 1px;
}
.container-video {
display: flex;
flex-direction: row;
margin-top: 20px;
text-align: center;
border: solid 1px;
line-height: 30px;
}
.video-info {
width: 100%;
}
.video-info-selected {
background-color: gainsboro;
}
.container-video-
PS:下次針對頁面的基本的功能增加一些背景的功能,
1. 登出(登出的接口)
2. 上傳視訊(比較大的功能)
3. 上傳頭像 (使用者的頭像的更改)
4. 使用者的資訊查詢(用的粉絲數,點贊數,關注數)
>>原創
>>原文連結位址: