主要用于渲染模型下列表设计在 pc 与 mobile 供用户查询的列表
mobile
列表页面主要包含两个部分组成,一个是查询条件的渲染,另外一个是数据列表项的渲染
使用方法
import * as applicationList from '@cloudpivot/list';
@Component({
name: 'FormList',
components: {
AppsList: applicationList.components.mobile.ApplicationList
}
})也可以只渲染查询条件的渲染:
// 引入
import * as applicationList from '@cloudpivot/list';
@Component({
name: 'FormList',
components: {
AppsList: applicationList.components.mobile.QueryForm
}
})
// 使用
<query-form ref="list" :fields="queryConditions"></query-form>
//
参数
// 列表设计请求的到是数据中 queryConditions 直接扔进去就可以渲染
// 查询确认
// 数据传递
mounted() {
Bus.$on('queryList', () => {
this.query();
});
}
destroyed() {
Bus.$off('queryList');
}
// 获取参数
query() {
const list = this.$refs.list as any;
const data = list.query();
}pc
pc 主要导出了两个模块,ApplicationList,ApplicationCustomIframe,ListSelector:
ApplicationList 主要用于渲染查询列表 与列表数据
ApplicationCustomIframe 主要用于渲染后台添加的自定义页面 的打开入口
ListSelector 主要用于关联表单选择时,对列表的选择
使用方式
// 引入
import * as applicationList from '@cloudpivot/list';
// 路由使用
applicationList: {
path: 'application-list/:schemaCode',
name: 'applicationList',
component: applicationList.components.pc.ApplicationList
}
// 自定义页面 iframe 打开
// 引入
import * as applicationList from '@cloudpivot/list';
@Component({
name: 'application-define',
components: {
applicationCustom: applicationList.components.pc.ApplicationCustomIframe
}
})
// 使用
<application-custom :url="url" />
// 参数
作为 iframe 打开的 url-
有用(6)
-
没有用(0)



