學(xué)習(xí)Vue.js動(dòng)畫(huà)時(shí),需要引入一個(gè)animate.css,如何全局引入外部文件呢?
創(chuàng)新互聯(lián)建站始終堅(jiān)持【策劃先行,效果至上】的經(jīng)營(yíng)理念,通過(guò)多達(dá)10年累計(jì)超上千家客戶的網(wǎng)站建設(shè)總結(jié)了一套系統(tǒng)有效的全網(wǎng)整合營(yíng)銷推廣解決方案,現(xiàn)已廣泛運(yùn)用于各行各業(yè)的客戶,其中包括:航空箱等企業(yè),備受客戶贊譽(yù)。
一.引入外部CSS樣式文件
1. 在app.vue中里面,而是發(fā)起新的請(qǐng)求獲得樣式資源,并且沒(méi)有加scoped。
注:如果有樣式時(shí),應(yīng)該放在#app上面引入,不然引入不成功!
2.@import改成引入外部樣式
二. 引入外部JS文件
1. 一個(gè)動(dòng)畫(huà)需要的JS庫(kù)(Velocity.js)
var Velocity = function (string) { // 這里是Velocity的具體實(shí)現(xiàn)算法 }
2.因?yàn)槲覀兿朐赩ue組件中想要引入Velocity函數(shù),那么要在Velocity加密算法的js腳本的最后,使用如下代碼,將Velocity函數(shù)導(dǎo)出:
export { Velocity }
注:外部腳本js不要放在components文件夾下,否則會(huì)一直報(bào)錯(cuò)。可以在src文件夾下新建一個(gè)js文件夾,然后將外部js腳本放在這個(gè)文件夾下,然后就可以在其他Vue組件中引入該js腳本。
3.在組件中使用 import { 函數(shù)名 } from 外部腳本名
來(lái)從外部js腳本中導(dǎo)入我們需要使用的函數(shù)。
import { Velocity } from '../config/velocity.js'
4. 在Vue組件中正常調(diào)用Velocity函數(shù)
enter: function (el, done) { Velocity(el, { opacity: 1, fontSize: '1.4em' }, { duration: 300 }) Velocity(el, { fontSize: '1em' }, { complete: done }) },
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持創(chuàng)新互聯(lián)。