更新记录

1.0.0(2021-04-22)

1.0.0版本发布


平台兼容性

阿里云 腾讯云
Vue2 Vue3
×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.1.0 app-vue app-nvue
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari

uni-admin插件通用教程:

uni-admin是一套基于uniCloud的开源应用管理端系统。详见:uni-admin 基础框架
本插件是uni-admin系统的扩展插件,为开发者的admin系统添加功能。
需先确保本机有uni-admin项目,然后将此插件导入到uni-admin项目下。
如本机没有uni-admin项目,需要先在HBuilderX中新建项目 -> uni-app项目 -> 选择uni-admin模板。
如本机的uni-admin项目版本过老,可能无法使用新插件,需及时升级本机的uni-admin项目。详见uni-admin项目更新日志


【me-page-design】页面装修插件 (uniCloud admin端)

基于uniCloud admin, 可快速自定义装修APP页面, 可配置图片热区,轮播banner,视频,浮层弹窗...

安装admin端

  1. 更新HBuilderX, 至少3.1.0+版本, 因为使用到uni_modules
  2. 在插件市场打开本插件页面, 在右侧点击使用 HBuilderX 导入插件, 选择uniCloud admin项目点击确定
  3. /uniCloud目录,右键运行云服务空间初始化向导, 关联云空间和部署uniCloud admin所需的云函数和数据库
  4. /uni_modules/me-page-design/uniCloud/cloudfunctions/me-page-design,右键上传部署云函数
  5. /uni_modules/me-page-design/uniCloud/database/db_init.json,右键初始化数据库
  6. pages.json中添加页面路径
    "pages": [
    // ……其他页面配置
    // 页面装修
    {
        "path": "uni_modules/me-page-design/pages/design/list",
        "style": {
            "navigationBarTitleText": "页面装修"
        }
    },
    {
        "path": "uni_modules/me-page-design/pages/design/edit",
        "style": {
            "navigationBarTitleText": "编辑装修页面"
        }
    }
    ]

安装APP端

APP端集成文档: https://ext.dcloud.net.cn/plugin?name=app-page-design

admin端的使用

  1. 运行uniCloud admin项目到Chrome
  2. 初次使用时, 点击菜单管理,会自动生成待添加菜单, 选中页面装修即可添加菜单
  3. 点击页面装修的菜单,可查看示例,也可按照指引完成APP页面的装修

APP端的使用

场景一: 打开装修页

// 查询别名的方式打开
uni.navigateTo({url: "/uni_modules/app-page-design/pages/design?name=xxx"})
// 查询id的方式打开
// uni.navigateTo({url: "/uni_modules/app-page-design/pages/design?id=xxx"})

场景二: tab页是装修页 / 装修组件的单独使用

<template>
    <view>
        <app-page-design :res="res"></app-page-design>
    </view>
</template>

<script>
    import {apiDesignDetail} from '@/uni_modules/app-page-design/api/api.js'
    export default {
        data() {
            return {
                res: {}
            }
        },
        onLoad() {
            // 根据name或id查询装修页
            let param = {name: "xxx"} // 或 {id: "xxx"}
            apiDesignDetail(param).then(res=>{
                this.res = res
            })
        }
    }
</script>

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问