本篇內(nèi)容介紹了“react如何引入外部方法”的有關(guān)知識(shí)，在實(shí)際案例的操作過(guò)程中，不少人都會(huì)遇到這樣的困境，接下來(lái)就讓小編帶領(lǐng)大家學(xué)習(xí)一下如何處理這些情況吧！希望大家仔細(xì)閱讀，能夠?qū)W有所成！

創(chuàng)新互聯(lián)公司長(zhǎng)期為成百上千家客戶提供的網(wǎng)站建設(shè)服務(wù)，團(tuán)隊(duì)從業(yè)經(jīng)驗(yàn)10年，關(guān)注不同地域、不同群體，并針對(duì)不同對(duì)象提供差異化的產(chǎn)品和服務(wù)；打造開放共贏平臺(tái)，與合作伙伴共同營(yíng)造健康的互聯(lián)網(wǎng)生態(tài)環(huán)境。為防城港企業(yè)提供專業(yè)的網(wǎng)站設(shè)計(jì)、成都網(wǎng)站制作，防城港網(wǎng)站改版等技術(shù)服務(wù)。擁有10年豐富建站經(jīng)驗(yàn)和眾多成功案例,為您定制開發(fā)。

react引入外部方法的方法：1、通過(guò)import引入外部方法；2、通過(guò)react中的生命周期來(lái)引入外部方法，代碼如“componentDidMount(){let scriptSrc = ['/config/jquery.min.js', '/config/lib/codemirror.js']scriptSrc.map(res => {...}”。

記錄react引入外部功能js問(wèn)題

在做react項(xiàng)目時(shí)，有的時(shí)候需要引用其他原生js模塊（也就是方法）

如果該js內(nèi)是通過(guò)es6的export default導(dǎo)出的則在jsx中可以通過(guò)import引入；

但如果該js只是一個(gè)方法也沒有通過(guò)es6等導(dǎo)出必須通過(guò)script引入；

例如我寫了一個(gè)原生js或著在一個(gè)js中通過(guò)jquery來(lái)操作節(jié)點(diǎn)返回值也就是當(dāng)點(diǎn)擊頁(yè)面元素時(shí)觸發(fā)原生事件，則在jsx中不可通過(guò)import引入

引入該js有兩種方法

1.如果在你的react框架中的html中引入

2.也可在jsx中通過(guò)react的中的生命周期來(lái)引入

例如

   componentDidMount() {
        // 要引入的js文件地址
        let scriptSrc = ['/config/jquery.min.js', '/config/lib/codemirror.js']
        scriptSrc.map(res => {
            // 動(dòng)態(tài)創(chuàng)建script標(biāo)簽
            var script = document.createElement('script');
            // 規(guī)則
            script.type = "text/javascript"
            // script中src只想路徑
            script.src = res;
            // 追加到html的head頭中
            document.head.appendChild(script);
        })
        var script = document.createElement('script')
        script.type = 'text/javascript'
        script.src = '/config/show-hint.js'
        // 追加到html中body的內(nèi)
        document.body.append(script)
        var script = document.createElement('script');
        script.type = "text/javascript"
        script.src = '/config/formula.js';
        // 追加到html中body的內(nèi)
        document.body.append(script);
    }

需要引入進(jìn)去幾個(gè)js，就需要?jiǎng)討B(tài)創(chuàng)建幾個(gè)script標(biāo)簽，不然后者會(huì)將前者覆蓋

將js添加到頭的話是因?yàn)?/p>

必須等到全部的js代碼都下載解析和執(zhí)行完成以后，才開始展現(xiàn)頁(yè)面內(nèi)容

引入的時(shí)候有個(gè)坑

在html中script引入js的話他的js地址為

http://http://localhost:端口號(hào)/你的js名稱

也就是指瀏覽器找尋的js地址是你項(xiàng)目中public中的文件也就是靜態(tài)資源下的文件，所以我們需要將js放入public（靜態(tài)資源目錄下）引入的話直接/你的路徑。

“react如何引入外部方法”的內(nèi)容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識(shí)可以關(guān)注創(chuàng)新互聯(lián)網(wǎng)站，小編將為大家輸出更多高質(zhì)量的實(shí)用文章！