更新记录

1.0.5（2023-09-19） 下载此版本

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

1.0.4（2023-09-18） 下载此版本

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

1.0.3（2023-09-18） 下载此版本

【修改】添加图片组件

平台兼容性

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