引入引用WeUI组件方法
- 通过npm方式，（此方法比较复杂些）。可以通过npm方式下载构建，npm包名为weui-miniprogram。
- 按需求下载，地址：https://developers.weixin.qq.com/miniprogram/dev/extended/weui/download.html
本篇文章采用第一种方法，实现方式：
1、进入node.js（https://nodejs.org/en/）官网，下载官网推荐的版本。
nodejs下载
2、下载完成后，我们双击安装包，直接下一步。所有配置按默认安装推荐的来进行。不需要改任何设置。
3、安装完成后，我们打开微信小程序的开发工具，进入项目，找到如下图中的终端。
终端
npm init
package.json
package-lock.json
构建npm
设置使用npm模块
9、在小程序页面对应的app.wxss文件中引入weui.wxss，添加代码：
@import '/miniprogram_npm/weui-miniprogram/weui-wxss/dist/style/weui.wxss';
10、在小程序页面对应的.json文件中引入组件，添加代码：
"usingComponents": {
"mp-cells": "/miniprogram_npm/weui-miniprogram/cells/cells",
"mp-cell": "/miniprogram_npm/weui-miniprogram/cell/cell",
"mp-badge": "/miniprogram_npm/weui-miniprogram/badge/badge"
}
11、在小程序页面对应的.wxml文件中，添加代码：
<view class="container">
<view class="page__bd">
<mp-cells title="新消息提示跟摘要信息后，统一在列表右侧">
<mp-cell title="单行列表" link>
<view slot="footer">
<view style="display: inline-block;vertical-align:middle; font-size: 17px;">详细信息</view>
<mp-badge style="margin-left: 5px;margin-right: 5px;" content="9" ext-class="blue"/>
</view>
</mp-cell>
</mp-cells>
</view>
</view>
