1. Ikhtisar
Gunakan panel aksi di YiDA untuk menulis kode JS yang menjalankan logika bisnis atau memeriksa kondisi.
Panel aksi mempermudah pengorganisasian dan penggunaan ulang kode, sekaligus membangun interaksi yang kompleks.
- Logika yang ditulis di panel JS umumnya tidak berlaku untuk data historis.
Fungsi yang dideklarasikan dengan export akan dikenali panel aksi sehingga dapat dipilih dan dipanggil dari sana.
Perhatikan kode berikut:
Catatan:
Hanya deklarasi yang cocok dengan pola export function xxx() {} yang dikenali di panel aksi komponen. Nama metode yang diekspor harus unik.
Untuk memanggil aksi di panel secara manual, panggil this.methodName(); secara langsung.
2.1 Binding aksi di panel aksi
Sebagian besar komponen di YiDA mendukung binding aksi.
Binding aksi menghubungkan aksi sebuah komponen dengan fungsi yang didefinisikan di panel aksi.
2.2 Ambil parameter fungsi Callback
Ambil parameter yang telah dikonfigurasi di fungsi Callback.
(1) Setel parameter di pengaturan aksi
Buat sebuah aksi.
(2) Ambil parameter seperti berikut:
3. Panduan Pengguna API
Untuk detailnya, lihat Panduan Pengguna API YiDA.
4. Cara men-debug kode JS
Gunakan Chrome Devtools untuk melakukan debug. Jika Anda sering melakukan debug, akses YiDA melalui browser.
Panel yang paling sering digunakan adalah Console, Network, dan Elements.
Halaman tampilan YiDA dibangun dengan React, sehingga Anda juga dapat memasang React Developer Tools untuk melakukan debug pada UI YiDA.
4.1 Gunakan kata kunci debugger di dalam kode
Di dalam fungsi JS, gunakan kata kunci debugger untuk menjeda eksekusi guna keperluan debugging. Video berikut mendemonstrasikan penggunaan dasar debugger.
4.2 Cara mereferensikan sumber daya JS pihak ketiga
Pastikan Anda memverifikasi Keamanan setiap sumber daya JS yang direferensikan. Perhatikan kode berikut:
4.3 Cara mempelajari JS
- Pusat Pengembang YiDA
- JavaScript Garden
- JavaScript | MDN
- Buku yang direkomendasikan: “Professional JavaScript for Web Developers” (edisi terbaru)
- Komunitas: Juejin, Stack Overflow, GitHub, dan lain-lain
Saat data subformulir berubah, selain suntingan di tingkat Sel, perhitungan Formula, keterkaitan data, dan penetapan nilai eksternal juga memicu Peristiwa onChange pada subformulir. Untuk membantu Anda mengidentifikasi sumber perubahan, changes.fieldId diperkenalkan untuk menunjukkan Sel mana yang datanya berubah.
5.3 Perbarui data baris terkait saat data pada Tabel berubah
Gunakan API updateItemValue untuk menetapkan nilai ke Sel.
Sebagai contoh, saat sebuah perangkat berubah, gunakan API tersebut untuk mengisi informasi lainnya pada subformulir saat ini.
Anda tidak perlu lagi menetapkan nilai satu per satu melalui getComponent().setValue seperti sebelumnya. Cara tersebut tidak dapat menjamin pembaruan Formulir secara utuh dalam skenario asinkron.
6. Kesalahan umum
6.1 Cannot read property ’$’ of undefined.
6.2 Permintaan ini telah diblokir; konten harus disajikan melalui HTTPS
Domain YiDA adalah https://www.yidaapps.com. Karena batasan Keamanan browser, hanya endpoint HTTPS yang dapat dipanggil; endpoint HTTP tidak diizinkan. Endpoint lokal seperti http://192.168.xxx juga akan diblokir.
Penting:
Untuk menyediakan layanan API, endpoint Anda harus memenuhi persyaratan berikut:
-
Menggunakan protokol HTTPS dengan sertifikat yang valid.
-
Mengizinkan akses lintas asal (cross-origin) dari www.yidaapps.com. Jika tidak, akan terjadi kesalahan kebijakan lintas situs.