great-vue

友情链接

great-generator、
great-jsutils、
great-ngform、
great-zorroutils、
great-vue

layout

``vue
import {layout} from 'great-vue';
Vue.use(layout);
`
`html

layout-top

菜单栏

layout-bottom


`

menu

`html

`
`js
data(){
return {
menuList:[]
}
},
mounted() {
this.menuList = [
{
text:'布局示例',
link:'#/',
children:[
{
text:'layout01',
link:'#/',
},
{
text:'layout02',
link:'#/layout02',
children:[
{
text:'layout02-01',
link:'#/',
},
{
text:'layout02-02 ',
link:'#/layout02',
}
],
}
]
},
{
text:'卡片示例',
link:'#/card'
}
];
}
`

modal

| 参数 | 说明 | 默认值 | 类型 |
| -----:| :---- | :---- | :---- |
| content | 显示的内容 | 无 | 文本、html片段、vue组件 |
| Vue | 当前Vue对象 | 无 | Vue |
| title | 标题 | 无 | string |
| cancelText | 取消按钮文本，传空则不显示 | 取消 | string |
| okText | 确定按钮文本，传空则不显示 | 确定 | string |
| autoClose | 点击确定、取消按钮后是否自动关闭模态框 | true | boolean |

* 示例：弹出一个普通文本
`js
import { greatModalUtil } from "great-vue";
import Vue from "vue";
openModalHtml() {
greatModalUtil.openModal({
content:'这是一个普通文本',
Vue,
})
.then((v) => {
console.log(v);
});
}
`
* 示例：弹出一个html片段
`js
import { greatModalUtil } from "great-vue";
import Vue from "vue";
openModalHtml() {
greatModalUtil.openModal({
content:'

这是一个html片段XX

',
Vue,
})
.then((v) => {
console.log(v);
});
}
`
* 示例：弹出一个自定义组件
`js
import { greatModalUtil } from "great-vue";
import Vue from "vue";
import CardDemo01 from "../card/card-demo01";
openModalHtml() {
greatModalUtil.openModal({
content:CardDemo01,
Vue,
})
.then((v) => {
console.log(v);
});
}
`

card

utils

$3

`js
import {base64Utils} from 'great-vue';
// 判断是否为base64的数据
const isBase64 = base64Utils.isBase64(this.value1);
if(isBase64){
// 将base64解码
this.value2 = base64Utils.decode(this.value1);
}else{
// 用户base64编码
this.value2 = base64Utils.encode(this.value1);
}
`

$3

`js
import {httpUtils} from 'great-vue';
httpUtils.get(url);
httpUtils.post(url, data);
httpUtils.put(url, data);
httpUtils.ajax({url});
`

$3

`vue


``
#### 方法
* greatFormValidator.required：必填
* greatFormValidator.email：邮箱格式
* greatFormValidator.mobile：手机号格式
* greatFormValidator.landline：座机号格式
* greatFormValidator.phone：电话号格式
* greatFormValidator.url：URL格式
* greatFormValidator.number：数字格式
* greatFormValidator.strLength：字符串长度校验
#### 属性与参数
* great-emc：显示校验未通过消息的容器（class名）
* great-validator-options
* errorMsgContainer：显示校验未通过消息的容器（class名）
* errorMsg：校验未通过时的提醒信息
* max：数字时的最大值
* min：数字旱的最小值
* minScale：最少小数位数
* maxScale：最多小数位数
* scale：小数位数
* maxLength：maxLength
* minLength：minLength
* length：length