forked from AkkomaGang/admin-fe
add icon tips
This commit is contained in:
parent
90fd4328b7
commit
c182a119e1
2 changed files with 9 additions and 3 deletions
|
@ -2,11 +2,11 @@ import Vue from 'vue'
|
||||||
import IconSvg from '@/components/Icon-svg'// svg组件
|
import IconSvg from '@/components/Icon-svg'// svg组件
|
||||||
import generateIconsView from '@/views/svg-icons/generateIconsView.js'// just for views/icons , you can delete it
|
import generateIconsView from '@/views/svg-icons/generateIconsView.js'// just for views/icons , you can delete it
|
||||||
// register globally
|
// register globally
|
||||||
|
|
||||||
Vue.component('icon-svg', IconSvg)
|
Vue.component('icon-svg', IconSvg)
|
||||||
|
|
||||||
const requireAll = requireContext => requireContext.keys().map(requireContext)
|
const requireAll = requireContext => requireContext.keys().map(requireContext)
|
||||||
const req = require.context('./svg', false, /\.svg$/)
|
const req = require.context('./svg', false, /\.svg$/)
|
||||||
|
|
||||||
const iconMap = requireAll(req)
|
const iconMap = requireAll(req)
|
||||||
|
|
||||||
console.log(generateIconsView)
|
|
||||||
generateIconsView.generate(iconMap) // just for views/icons , you can delete it
|
generateIconsView.generate(iconMap) // just for views/icons , you can delete it
|
||||||
|
|
|
@ -2,7 +2,12 @@
|
||||||
<div class="icons-container">
|
<div class="icons-container">
|
||||||
<div class="icons-wrapper">
|
<div class="icons-wrapper">
|
||||||
<div v-for='item of iconsMap' :key='item' class='icon-item'>
|
<div v-for='item of iconsMap' :key='item' class='icon-item'>
|
||||||
|
<el-tooltip placement="top" effect="light">
|
||||||
|
<div slot="content">
|
||||||
|
{{`<icon-svg :icon-class="${item}" />`}}
|
||||||
|
</div>
|
||||||
<icon-svg :icon-class="item" />
|
<icon-svg :icon-class="item" />
|
||||||
|
</el-tooltip>
|
||||||
<span>{{item}}</span>
|
<span>{{item}}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -42,6 +47,7 @@ export default {
|
||||||
float: left;
|
float: left;
|
||||||
font-size: 40px;
|
font-size: 40px;
|
||||||
color: #666;
|
color: #666;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
span {
|
span {
|
||||||
display: block;
|
display: block;
|
||||||
|
|
Loading…
Reference in a new issue