Skip to content

Latest commit

 

History

History
150 lines (104 loc) · 4.17 KB

readme.md

File metadata and controls

150 lines (104 loc) · 4.17 KB

Avatar

image-20201130153821293

属性

属性名 含义 类型 必填 默认值
url 头像图片路径 String
size 头像尺寸,宽高相等 Number 150

Icon

image-20201130153927256

图标组件

使用的图标源来自于「阿里巴巴矢量库」

属性

属性名 含义 类型 必填 默认值
type 图标类型 String

有效的图标类型:

iShot2020-11-30下午03.47.09

Pager

属性

属性名 含义 类型 必填 默认值
current 当前页码 Number 1
total 总数据量 Number 0
limit 页容量 Number 10
visibleNumber 可见页码数 Number 10

事件

事件名 含义 事件参数 参数类型
pageChange 页码变化 新的页码 Number

Empty

image-20201130165011681

该组件需要在外层容器中横向垂直居中

属性

属性名 含义 类型 必填 默认值
text 显示的文字 String "无数据"

ImageLoader

该组件可以实现一个渐进式图片

alt tag

属性

属性名 含义 类型 必填 默认值
src 原始图片的路径 String
placeholder 原始图片加载完成前的占位图片 String
duration 原始图片加载完成后,切换到原始图经过的毫秒数 Number 500

事件

事件名 含义 事件参数 参数类型
load 原始图片加载完成后触发

示例

<ImageLoader 
	src="https://images.pexels.com/photos/33109/fall-autumn-red-season.jpg?fit=crop&crop=entropy&w=3456&h=2304"
  placeholder="https://images.pexels.com/photos/33109/fall-autumn-red-season.jpg?w=100"
/>

Contact

iShot2020-11-30下午04.55.47

该组件需要横向撑满容器,背景色透明

  1. 如何实现点击弹出QQ对话?

    设置超链接为:tencent://message/?Menu=yes&uin=要对话的QQ号&Service=300&sigT=45a1e5847943b64c6ff3990f8a9e644d2b31356cb0b4ac6b24663a3c8dd0f8aa12a595b1714f9d45

  2. 如何实现点击弹出发送邮件?

    设置超链接为:mailto:邮件地址

Menu

image-20201130195147086

该组件需要横向撑满容器,背景色透明

每个菜单的信息如下:

首页

链接地址:/

选中条件:路径等于 /

文章

链接地址:/blog

选中条件:路径以/blog开头

关于我

链接地址:/about

选中条件:路径等于/about

项目&效果

链接地址:/project

选中条件:路径等于/project

留言板

链接地址:/message

选中条件:路径等于/message

SiteAside

image-20201130200148681

网站侧边栏

宽度和高度撑满外层容器