基于GoView低代码平台的可视化ui组件

该组件需要配合 GoView 使用，在 GoView 低代码平台拖拽并配置完成后，下载导出对应页面的 json 数据格式，再传该组件进行展示。

npm/pnpm 方式安装使用

npm i goview-ui
pnpm i goview-ui

全局注册使用

// 在main.js中按下引入
import goViewui from "goview-ui";
import "goview-ui/dist/style.css";
import { createPinia } from "pinia";
const pinia = createPinia();
const app = createApp(App);
window["$vue"] = app;
window["pinia"] = pinia;
app.use(pinia).use(goViewui).mount("#app");

使用插槽自定义内容

在 GoView 平台组件无法满足项目业务需求时，可使用插槽对区域内容进行自定义。

 <goView :dataJson="dataJson">
    <template #map>
      <div style="background: red;width: 100%;height: 100%;">
        <h1 style="color: #fff;">地图</h1>
      </div>
      <template #id_4fx2fk7cqzk000>
        <div style="background: red; width: 100%; height: 100%">
          <h1 style="color: #fff">通过id进行插槽定义</h1>
        </div>
      </template>
    </template>
  </goView>

定义插槽名称

代码示例

GoView 在线体验

goview-ui Github 在线文档示例

交流/打赏