Mpui NPM | npm.io

MpUI (Mini-program's UI for mpvue)

MpUI 是一套基于 weui-wxss 开发的 mpvue 组件库，增加了一些新的特性、样式和组件。

说明

部分组件因 mpvue 尚不支持的语法而无法实现，详细见不支持列表。

开发文档

安装

$ yarn add mpui

预览

$ git clone https://github.com/kankungyip/mpui
$ cd mpui
$ yarn run example

用微信web开发者工具打开 mpui 项目目录。

使用

引入全局样式

<style lang="less">
@import "path/to/node_modules/mpui/theme/mpui";
</style>

并非全部组件样式，仅全局（字体、颜色等）样式和未被 Vue 组件化的 weui-wxss。

使用组件

<template>
  <ui-article :content="content" />
</template>

<script>
import uiArticle from 'mpui/components/article'

export default {
  components: {
    uiArticle,
  },

  data () {
    return {
      content: `# 大标题

## 章标题

### 1.1 节标题

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

![](https://mp.weixin.qq.com/wxopen/qrcode?action=show&type=2&fakeid=3834027984&token=2071919981)

### 1.2 节标题

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
`,
    }
  },
}
</script>

需要 Slot 支持暂未实现的组件，请使用全局样式，详细见文档。