reactjs - React typescript bileşenlerinden harici Javascript fonksiyonunu çağırma

TypeScript ile bir React Redux uygulamam var. Durum şöyle: Bazı JavaScript içeren bir index.cshtml dosyam var.

<script type="text/javascript">
    function test() {
        alert('Function from index.html');
    }
</script>

Şimdi React bileşenimde, Main.tsx dosyasında componentWillMount() fonksiyonunda test fonksiyonunu çağırmak istiyorum.

componentWillMount() {
    window.test();
}

ama bu benim için işe yaramıyor. Mesaj test, window türünde mevcut değil

Her türlü yardım çok takdir edilir.

Cevap #1

Bu şekilde Window arayüzünü genişletebilirsiniz:

interface Window {
    test(): void;
}

Bunu bir modül içinde yaparken, genişlettiğinizin global Window arayüzü olduğundan emin olmanız gerekir:

declare global {
    interface Window {
        test(): void;
    }
}

Bu, tür uygulamasını derleyiciye sağlar.

Cevap #2

Burada bazı Yardımcı sınıf kullanmayı öneriyorum. Anladığım kadarıyla diğer bileşenlerde kullanabileceğiniz bazı fonksiyonlara ihtiyacınız var. Bu yüzden en iyi yol, statik yöntemlere sahip bir Util sınıfı yaratmak veya buna benzer bir modül oluşturmaktır:

export default {
  test() {
    console.log('foo'); 
  }, ...

};

İlgili makaleler