{
    "name": "gov-row-grid",
    "label": "左图右文宫格",
    "description": "左图右文宫格",
    "codeSnap": "<view>\n    <gov-row-grid\n        list=\"{{[{\n            icon,\n            title: '语文'\n        },\n        {\n            icon,\n            title: '数学'\n        },\n        {\n            icon,\n            title: '英语'\n        }]}}\"\n        column-num=\"3\">\n    </gov-row-grid>\n</view>",
    "groups": "layout",
    "demoCode": {
        "s": "<view>\n    <view class=\"preview-caption\">默认效果</view>\n    <gov-row-grid\n        list=\"{{listHasLine}}\">\n    </gov-row-grid>\n    <view class=\"preview-caption\">有竖分割线</view>\n    <gov-row-grid\n        list=\"{{listHasLine}}\"\n        column-num=\"3\"\n        binditemclick=\"bindItemClick\">\n    </gov-row-grid>\n    <view class=\"preview-caption\">无竖分割线</view>\n    <gov-row-grid\n        list=\"{{listHasLine}}\"\n        column-num=\"3\"\n        has-line=\"{{false}}\"\n        binditemclick=\"bindItemClick\">\n    </gov-row-grid>\n    <view class=\"preview-caption\">有横分割线</view>\n    <gov-row-grid\n        list=\"{{listThree}}\"\n        column-num=\"3\"\n        binditemclick=\"bindItemClick\">\n    </gov-row-grid>\n    <view class=\"preview-caption\">无横分割线</view>\n    <gov-row-grid\n        list=\"{{listThree}}\"\n        column-num=\"3\"\n        has-line=\"{{false}}\"\n        binditemclick=\"bindItemClick\">\n    </gov-row-grid>\n    <view class=\"preview-caption\">无点击态</view>\n    <gov-row-grid\n        list=\"{{listHasLine}}\"\n        column-num=\"3\"\n        has-line=\"{{false}}\"\n        has-hover=\"{{false}}\"\n        binditemclick=\"onItemClick\">\n    </gov-row-grid>\n    <view class=\"preview-caption\">文本超过显示省略号</view>\n    <gov-row-grid\n        list=\"{{listMore}}\"\n        border-radius=\"50\"\n        column-num=\"3\"\n        has-line=\"{{false}}\"\n        binditemclick=\"bindItemClick\">\n    </gov-row-grid>\n    <view class=\"preview-caption\">自定义样式宫格</view>\n    <gov-row-grid\n        gov-title=\"gov-title\"\n        gov-image-class=\"gov-image-class\"\n        list=\"{{listThree}}\"\n        border-radius=\"50\"\n        has-border=\"{{false}}\"\n        column-num=\"3\"\n        has-hover=\"{{false}}\"\n        has-line=\"{{false}}\"\n        binditemclick=\"bindItemClick\">\n    </gov-row-grid>\n</view>\n",
        "js": "const icon = 'http://himg.bdimg.com/sys/portrait/item/05796c696a695f6d756d758f61.jpg';\nPage({\n    data: {\n        listHasLine: [{\n            icon,\n            title: '语文'\n        },\n        {\n            icon,\n            title: '数学'\n        },\n        {\n            icon,\n            title: '英语'\n        }],\n        listThree: [{\n            icon,\n            title: '语文'\n        },\n        {\n            icon,\n            title: '数学'\n        },\n        {\n            icon,\n            title: '英语'\n        },\n        {\n            icon,\n            title: '逻辑'\n        },\n        {\n            icon,\n            title: '生物'\n        },\n        {\n            icon,\n            title: '地理'\n        }],\n        listMore: [{\n            icon,\n            title: '语文语文语文语文语文'\n        },\n        {\n            icon,\n            title: '数学数学数学数学数学'\n        },\n        {\n            icon,\n            title: '英语英语英语英语英语'\n        },\n        {\n            icon,\n            title: '逻辑逻辑逻辑逻辑逻辑'\n        },\n        {\n            icon,\n            title: '生物生物生物生物生物'\n        },\n        {\n            icon,\n            title: '地理地理地理地理地理'\n        }]\n    },\n    bindItemClick(e) {\n        swan.showToast({\n            title: e.detail.index,\n            icon: 'none'\n        });\n    },\n    onItemClick(e) {\n        swan.showToast({\n            title: '没有点击态',\n            icon: 'none'\n        });\n    }\n});",
        "css": ".gov-title {\n    color: rgba(182, 57, 57) !important;\n    font-weight: 700 !important;\n    font-size: 18px !important;\n    margin-left: 6px !important;\n    height: 30px !important;\n    line-height: 30px !important;\n}\n.gov-image-class {\n    width: 25px !important;\n    height: 25px !important;\n}"
    },
    "fragement": "",
    "properties": {
        "attributes": [
            {
                "name": "list",
                "type": "Array",
                "description": "宫格数据",
                "required": "是",
                "default": "[]"
            },
            {
                "name": "column-num",
                "type": "Number",
                "description": "每行显示几列，2列、3列、4列",
                "required": "否",
                "default": "2"
            },
            {
                "name": "has-line",
                "type": "Boolean",
                "description": "是否有竖分隔线，默认有",
                "required": "否",
                "default": "true"
            },
            {
                "name": "has-border",
                "type": "Boolean",
                "description": "图片是否有border，默认有",
                "required": "否",
                "default": "true"
            },
            {
                "name": "has-hover",
                "type": "Boolean",
                "description": "是否有点击态，默认有",
                "required": "否",
                "default": "true"
            },
            {
                "name": "border-radius",
                "type": "Number",
                "description": "图片圆角， 单位是rpx",
                "required": "否",
                "default": "3"
            },
            {
                "name": "binditemclick",
                "type": "function",
                "description": "点击宫格每一项的事件",
                "required": "否",
                "default": "-"
            }
        ],
        "events": [
            {
                "name": "itemclick",
                "type": "Event",
                "description": "点击宫格每一项的事件, 可以通过e事件对象, e.detail.index获取到每一项的索引值",
                "required": "否",
                "default": "-"
            }
        ],
        "externalClasses": [
            {
                "name": "gov-grid-item",
                "type": "",
                "description": "整体宫格外层的扩展样式类，可通过此class改变其的样式，如内边距",
                "required": "否",
                "default": "-"
            },
            {
                "name": "gov-inner-grid-item",
                "type": "",
                "description": "（图片+标题）的扩展样式类，可通过此class改变其的样式，如背景色",
                "required": "否",
                "default": "-"
            },
            {
                "name": "gov-title",
                "type": "",
                "description": "标题title的扩展样式类，可以通过此class改变其外层的样式，如设置字大小：font-size: 60px",
                "required": "否",
                "default": "-"
            },
            {
                "name": "gov-image-class",
                "type": "",
                "description": "当设置hasBoder=false时,左边图片的扩展样式，可通过此class改变其外部的样式，如设置宽度：width: 25px",
                "required": "否",
                "default": "-"
            }
        ]
    }
}