Pengenalan Rangka Kerja Wicket

1. Gambaran keseluruhan

Wicket adalah kerangka berorientasikan komponen web sisi pelayan Java yang bertujuan mempermudah pembinaan antara muka web dengan memperkenalkan corak yang diketahui dari pengembangan UI desktop.

Dengan Wicket adalah mungkin untuk membangun aplikasi web dengan hanya menggunakan kode Java dan halaman HTML yang sesuai dengan XHTML. Tidak memerlukan Javascript, atau fail konfigurasi XML.

Ini menyediakan lapisan sepanjang kitaran permintaan-permintaan, melindungi dari bekerja pada tahap rendah dan memungkinkan pemaju untuk fokus pada logik perniagaan.

Dalam artikel ini, kami akan memperkenalkan asas-asasnya dengan membuat aplikasi HelloWorld W icket, diikuti dengan contoh lengkap menggunakan dua komponen bawaan yang saling berkomunikasi.

2. Persediaan

Untuk menjalankan projek Wicket, mari tambahkan kebergantungan berikut:

 org.apache.wicket wicket-core 7.4.0 

Anda mungkin ingin melihat versi terbaru Wicket di repositori Maven Central, yang pada masa pembacaan anda mungkin tidak bertepatan dengan yang digunakan di sini.

Sekarang kami bersedia untuk membina aplikasi Wicket pertama kami.

3. HelloWorld Wicket

Mari kita mulakan dengan subclass kelas WebApplication Wicket , yang, sekurang-kurangnya, memerlukan kaedah kelas getHomePage () .

Wicket akan menggunakan kelas ini sebagai pintu masuk utama aplikasi. Di dalam kaedah, kembalikan objek kelas dari kelas bernama HelloWorld:

public class HelloWorldApplication extends WebApplication { @Override public Class getHomePage() { return HelloWorld.class; } }

Wicket menyokong konvensyen berbanding konfigurasi. Menambah halaman web baru ke aplikasi memerlukan pembuatan dua file: file Java dan file HTML dengan nama yang sama (tetapi ekstensi yang berbeda) di bawah direktori yang sama. Konfigurasi tambahan hanya diperlukan jika anda ingin mengubah tingkah laku lalai.

Dalam direktori pakej kod sumber, tambahkan HelloWorld.java terlebih dahulu :

public class HelloWorld extends WebPage { public HelloWorld() { add(new Label("hello", "Hello World!")); } }

kemudian HelloWorld.html :

Sebagai langkah terakhir, tambahkan definisi penapis di dalam web.xml:

 wicket.examples  org.apache.wicket.protocol.http.WicketFilter   applicationClassName  com.baeldung.wicket.examples.HelloWorldApplication   

Itu sahaja. Kami baru sahaja mengkod aplikasi web Wicket pertama kami.

Jalankan projek dengan membina fail perang , ( pakej mvn dari baris perintah) dan letakkan di wadah servlet seperti Jetty atau Tomcat.

Mari akses // localhost: 8080 / HelloWorld / dalam penyemak imbas. Halaman kosong dengan mesej Hello World! akan muncul.

4. Komponen Wicket

Komponen dalam Wicket adalah triad yang terdiri dari kelas Java, markup HTML, dan model. Model adalah fasad yang digunakan komponen untuk mengakses data.

Struktur ini memberikan pemisahan kebimbangan yang baik dan dengan melepaskan komponen dari operasi yang berpusatkan data, meningkatkan penggunaan semula kod.

Contoh yang berikut menunjukkan cara menambahkan tingkah laku Ajax ke komponen. Ini terdiri daripada halaman dengan dua elemen: menu lungsur dan label. Apabila pilihan dropdown berubah, label (dan hanya label) akan dikemas kini.

Kandungan fail HTML CafeSelector.html akan minimum, dengan hanya dua elemen, menu lungsur, dan label:

Address: address

Di sisi Java, mari buat label:

Label addressLabel = new Label("address", new PropertyModel(this.address, "address")); addressLabel.setOutputMarkupId(true);

Argumen pertama dalam konstruktor Label yang sepadan dengan wicket: id yang diberikan dalam fail HTML. Argumen kedua adalah model komponen, pembungkus untuk data asas yang disajikan dalam komponen.

The setOutputMarkupId kaedah menjadikan layak komponen bagi pengubahsuaian melalui Ajax. Sekarang mari kita buat senarai dropdown dan tambahkan tingkah laku Ajax kepadanya:

DropDownChoice cafeDropdown = new DropDownChoice( "cafes", new PropertyModel(this, "selectedCafe"), cafeNames); cafeDropdown.add(new AjaxFormComponentUpdatingBehavior("onchange") { @Override protected void onUpdate(AjaxRequestTarget target) { String name = (String) cafeDropdown.getDefaultModel().getObject(); address.setAddress(cafeNamesAndAddresses.get(name).getAddress()); target.add(addressLabel); } });

Penciptaannya serupa dengan label, pembuatnya menerima id wicket, model dan senarai nama kafe.

Kemudian AjaxFormComponentUpdatingBehavior ditambahkan dengan kaedah panggilan balik onUpdate yang mengemas kini model label setelah permintaan ajax dikeluarkan. Akhirnya, komponen label ditetapkan sebagai sasaran untuk menyegarkan.

Akhirnya, komponen label ditetapkan sebagai sasaran untuk menyegarkan.

Seperti yang anda lihat semuanya Java, tidak perlu satu baris Javascript. Untuk mengubah label yang dipaparkan, kami hanya mengubah POJO. Mekanisme yang memodifikasi objek Java diterjemahkan menjadi perubahan di laman web yang berlaku di belakang tirai dan tidak relevan dengan pengembang.

Wicket menawarkan sebilangan besar komponen berkemampuan AJAX di luar kotak. Katalog komponen dengan contoh langsung boleh didapati di sini.

5. Kesimpulan

Dalam artikel pengantar ini, kami telah membahas asas-asas Wicket kerangka web berasaskan komponen di Java.

Wicket menyediakan lapisan abstraksi yang bertujuan untuk menghilangkan sepenuhnya kod paip.

Kami telah memasukkan dua contoh mudah, yang terdapat di GitHub, untuk memberi anda gambaran bagaimana perkembangan dengan rangka kerja ini.