render() {
const productsUIEvents = {
openDeleteProductsDialog: () => {
console.log('alow?');
}
};
gibi bir fonkisyonum var.
bunun altında da aşağıdakini return ettiriyorum;
return '<a href="#" class="btn btn-sm btn-light-info btn-text-primary btn-hover-primary btn-icon" data-toggle="tooltip" data-theme="dark" title="Detay">\
<i class="ki ki-eye icon-md"></i>\
</a>\
<a href="#" class="btn btn-sm btn-light-warning btn-text-primary btn-hover-primary btn-icon" data-toggle="tooltip" data-theme="dark" title="Düzenle">\
<i class="ki ki-gear icon-md"></i>\
</a>\
<a href="#" class="btn btn-sm btn-light-danger btn-text-primary btn-hover-primary btn-icon teklif-sil" data-toggle="tooltip" data-theme="dark" title="Sil"\
onClick="blablablabal">\
<i class="ki ki-bold-close icon-md"></i>\
</a>'
istiyorum ki, en aşağıdaki "a" nın içinde onClick'ime, yukarıdaki openDeleteProductsDialog fonksiyonunu çalıştırayım. ama nasıl aktif edebilirim? vallahi çözemedim.
ben de bugünlerde react ve typscript üzerine çalışıyorum ve sizden daha fazla bilmiyorum. ancak a tag'inin içindeki onclick'e metodun ismini doğrudan vermektense this.productsUIEvents.openDelete şeklinde çağırmayı deneyin. this JS ve React için çok önemli ve biraz da değişik bir kavram.
bu arada neden "a"? onclick veriyorsanız a button ya da button görünümlü başka bir şey vermeniz daha iyi olur. <a href="#"> in iyi bir fikir olduğunu düşünmüyorum.
<a onClick={productsUIEvents.openDeleteProductsDialog}>
veya parametre vermek gerekirse:
<a onClick={() => productsUIEvents.openDeleteProductsDialog(parametre)}>
Jsx kullanmiyor musun?
aslında kod kısmındaki karmaşadan biraz kurtarmak için;
codeshare.io
şöyle paylaşayım ben en iyisi.
bu şekilde ReactDOM kullandığımda
Target container is not a DOM Element
hatası alıyorum.
datatables.net'i, react'e implemente etmeye çalışıyorum.
Boyle bir seyi calistirmak mumkunse bile hacky bir yontemi vardir muhtemelen. Jquery’yi react ile kullanmamak daha mantikli olur ama mecbursan da sonradan dom’a eklenmis bir sey icinde react component’indeki koda erisebilir misin emin degilim. Index.html’e direkt eklersen productsUIEvents‘i eski yoldan react ile alakasiz cagirabilirsin. Tabi productsUIEvents‘in react tarafina bir bagimliligi yoksa.
medium.com
Jquery/plugin ve react ayrı ayrı dom manipulation yapıyor. React'in lifecycle hooklarını çok kullanmadım ama linkte benzer sorunlar yaşanmaması için yöntemleri yazmış.