1.安裝

?npm i @icon-park/vue

2.導入

說明：導入并在main.js使用。

import { install } from '@icon-park/vue/es/all';
import '@icon-park/vue/styles/index.css';
Vue.use(install)

3.打開官網

?ByteDance IconPark

?

?4.復制

說明：點擊官方圖標庫，然后依次按圖點擊。

說明：復制Vue代碼?

?

?5.使用

說明：粘貼復制到vue中，但是沒有顯示。原因是還需要加一個前綴icon-。

<script>
export default {name: "IconPark"
}
</script><template><div><h1>我是iconpark圖標</h1><all-application theme="multi-color" size="24" :fill="['#333' ,'#f5a623' ,'#FFF' ,'#43CCF8']"/></div></template><style scoped></style>

更正為icon-前綴。在fill屬性中，如果確定顏色后，可以將數組其他的顏色都刪除，保留一個即可。當然刪除fill屬性，圖標也會有一個默認的顏色。

 <icon-all-application theme="multi-color" size="24" :fill="['#333' ,'#f5a623' ,'#FFF' ,'#43CCF8']"/>

?