cmd组件制作登录/注册/个人中心页面模板

在Vue初学者使用uni-app时，制作登录、注册和个人中心页面模板是一个非常友好的方式。这篇文章将介绍如何使用cmd组件来实现这些功能，而且代码操作注释明确，方便理解和使用。

所需组件

以下是需要用到的组件及其对应的代码块：

• 动画组件名：cmd-transition 代码块： cmdTransition
• 头像组件名：cmd-avatar 代码块： cmdAvatar
• 底部导航栏组件名：cmd-bottom-nav 代码块： cmdBottomNav
• 列表单元组件名：cmd-cell-item 代码块： cmdCellItem
• icon图标组件名：cmd-icon 代码块： cmdIcon
• 输入框组件名：cmd-input 代码块： cmdInput
• 导航栏组件名：cmd-nav-bar 代码块： cmdNavBar
• 导航栏内容页组件名：cmd-page-body 代码块： cmdPageBody

全局样式设置

为了让自定义导航栏正常工作，我们需要进行一些全局样式的设置。在globalStyle中做出以下更改：

"globalStyle": {
  "navigationStyle": "custom",
  "app-plus": {
      "scrollIndicator": "none",
      "bounce": "none"
  }
}

通过上述设置，我们可以隐藏顶部导航条、滚动条和原生回弹阴影，以便使用自定义的导航栏。

使用全局样式

如果你在使用cmd组件时遇到了大小异常的情况，可以在组件内加上view标签通用样式：

/* 全局样式 */
@import url("./common/uni/uni.css");

/* 通用 */
view {
    font-size: 28upx;
    line-height: 1.8;
}

以上代码将为所有页面的视图元素提供统一的字体大小和行高。

通过以上步骤，你已经准备好开始制作登录、注册和个人中心页面模板了。使用cmd组件将使整个过程更加简单和友好，特别适合Vue初学者使用。祝你编码愉快！