更新记录

1.0.5(2023-09-19) 下载此版本

【修改】修改瀑布流内容切割问题

1.0.4(2023-09-18) 下载此版本

【修改】修改图片组件错误

1.0.3(2023-09-18) 下载此版本

【修改】添加图片组件

查看更多

平台兼容性

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

sailing-design-app

使用 vue3+vite+uviewplus 实现的页面插件,配合后台拖拽式设计快速生成页面,享受以组件的形式快速接入到各商城系统中。

使用说明

  1. 使用 hbuilderX 引入插件到项目中,
  2. 全局引入 scss 样式文件:/uni_modules/sailing-design-app/static/style/my.scss
  3. props: page: 页面数据
  4. slot: header: 自定义页面头部
  5. 下面以首页为例: home.vue
    <template>
     <sailing-design-app :page="pageData">
       <!-- 可根据业务需要添加自定义头部 -->
       <template #header>
         <view class="status-bar"></view>
         <view class="header-bar"></view>
       </template>
     </sailing-design-app>
    </template>
    <script setup>
     import { ref, onMounted } from 'vue'
     const pageData = ref({})
     const getPageData = async () => {
       // 根据个人系统,获取页面数据,并将数据传递给组件
       // 若为首页,则type类型为home,isActive为true,即where="type == 'home' && isActive == true"
       // 下面以采用原配数据库为例,获取首页数据,并展示
       const db = uniCloud.database().collection('saling-design-pages')
       uni.showLoading({ mask: true })
       let res = await db
         .where("type == 'home' && isActive == true")
         .field('cover, styles, components')
         .get({ getOne: true })
         .catch((e) => e)
         .finally((f) => uni.hideLoading())
       if (res.errCode !== 0) return uni.showToast({ title: res.errMsg })
       pageData.value = res.result?.data || {}
     }
     onMounted(() => getPageData())
    </script>

配套后台插件

星帆低代码可视化应用设计页面后端插件 - DCloud 插件市场

联系方式

  • QQ:3159485287
  • QQ 交流群:482506339

隐私、权限声明

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

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

插件不采集任何数据

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

许可协议

MIT协议

暂无用户评论。

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