1.3.4 • Published 9 months ago
vue-about-me v1.3.4
vue-about-me
Display copyright and some links about me.
How To Use
Import
You just need import it, and write it where you need.
Example
// index.js
import Vue from 'vue'
import App from './App.vue'
// ...
<!-- component -->
<template>
<div>
<vue-about-me :copyright="copyright" :links="links"></vue-about-me>
</div>
</template>
<script>
// use default name VueAboutMe
import VueAboutMe from 'vue-about-me'
import 'vue-about-me/style.css'
Icon
We use Iconify.
内置类型:自动生成对应图标
- github
- telegram
- blog
- bilibili
<!-- 仅当你需要额外图标时,添加它 -->
<!-- add this in your html -->
<script src="https://code.iconify.design/2/2.0.0/iconify.min.js"></script>
Then find icon name in https://icones.js.org.
Example
const copyright = {
name: 'Vue About Me',
repo: 'Vue-About-Me',
author: 'YunYouJun',
logo: 'ri:cloud-line',
// or
// logo: 'https://cn.vuejs.org/images/logo.png',
link: 'https://yunyoujun.github.io/vue-about-me/',
color: '#0078E7'
}
const links = [
{
// ...
icon: 'ri:cloud-line'
// ...
}
]
Template
<vue-about-me :copyright="copyright" :links="links"></vue-about-me>
You can see example
folder for more details.
Options
Attribute | Description | Type | Options | Default |
---|---|---|---|---|
isDark | 暗色模式 (黑色图标在暗色模式下会变成白色) | Boolean (可选) | - | false |
copyright | 显示版权 | Object | —— | |
links | 显示链接 | ArrayObject | —— |
copyright
Attribute | Description | Type | Options | Default |
---|---|---|---|---|
name | 名称 | string | Vue About Me | |
repo | 项目仓库名称(GitHub) | string | —— | Vue-About-Me |
author | 作者 | string | —— | YunYouJun |
icon | 图标名称 | string | —— | cloud 或 ri:cloud-line (ref icones.js.org) |
link | 图标链接 | string | —— | # |
color | 图标颜色 | string | —— | #0078E7 |
links
Name | Type |
---|---|
links | Array |
link | Object |
link
Attribute | Description | Type | Options | Default |
---|---|---|---|---|
type | 类型(自动生成对应图标) | string | Icon | --- |
name | 名称 | —— | ||
color | 颜色 | —— | ||
backgroundColor | 背景颜色 | —— | transparent | |
icon | 图标名称 | —— | ||
label | 标签提示 | —— | ||
href | 链接 | —— |
Sponsors
1.3.4
9 months ago
1.3.3
9 months ago
1.3.2
9 months ago
1.3.0
9 months ago
1.2.7
3 years ago
1.2.6
3 years ago
1.2.5
3 years ago
1.2.4
3 years ago
1.2.3
4 years ago
1.2.2
4 years ago
1.2.1
4 years ago
1.2.0
4 years ago
1.1.5
4 years ago
1.1.4
4 years ago
1.1.1
4 years ago
1.0.2
4 years ago
1.1.0
4 years ago
1.0.1
4 years ago
1.1.3
4 years ago
1.1.2
4 years ago
1.0.3
4 years ago
1.0.0-alpha.5
4 years ago
1.0.0-alpha.4
4 years ago
1.0.0-alpha.3
4 years ago
1.0.0-alpha.2
4 years ago
1.0.0-alpha.1
4 years ago
0.3.2
5 years ago
0.3.1
5 years ago
0.3.0
5 years ago
0.2.4
6 years ago
0.2.3
6 years ago
0.2.2
6 years ago
0.2.1
6 years ago
0.2.0
6 years ago
0.1.0
7 years ago
0.0.5
7 years ago
0.0.4
7 years ago
0.0.3
7 years ago
0.0.2
7 years ago
0.0.1
7 years ago