Twack
v2.3.3
Komponen yang dapat digunakan kembali untuk proses proses Anda!
Selamat datang di Twack! Twack membantu Anda membangun proyek proses yang terstruktur dengan baik dan dapat dipelihara. Terinspirasi oleh Angular.
| ProcessWire-Module: | https://modules.processwire.com/modules/twack/ |
| Dukungan-forum: | https://processwire.com/talk/topic/23549-twack/ |
| Gudang: | https://github.com/sebiworld/twack |
| Wiki: | https://github.com/sebiworld/twack/wiki/ |
Twack dapat diinstal seperti setiap modul lain di Processwire. Periksa panduan berikut untuk informasi terperinci: cara menginstal atau uninstall modul
Prasyaratnya adalah PHP> = 5.5.0 dan versi ProcessWire> = 3.0.0 . Namun, ini juga diperiksa selama pemasangan modul. Tidak ada dependensi lebih lanjut.
Twack menggunakan komponen untuk membagi situs web menjadi komponen logis. Komponen yang khas dapat berdiri sendiri dan tidak memiliki ketergantungan, yang membuatnya dapat digunakan kembali dan mudah dipelihara. Sebagian besar komponen terdiri dari pengontrol dan tampilan.
Jika Anda belum selesai, buat direktori site/templates/components . Di sini kita akan menempatkan semua komponen masa depan kita. Tambahkan file baru hello_world.view.php di dalam direktori. Buat site/templates/services di mana semua kelas layanan kami akan menemukan rumah.
Buka file dan isi konten berikut:
<?php
namespace ProcessWire ;
?>
<h2>Hello World!</h2>Itu sudah selesai! Kami memiliki komponen fungsi pertama kami. Diakui, komponen hanya terdiri dari satu tampilan, tetapi bahkan untuk komponen sederhana ada banyak tujuan yang berguna. Kami akan menambahkan penanganan data dan fungsi sebentar lagi. Tapi pertama-tama, mari kita pelajari cara menggunakan komponen kami di salah satu proses proses kami.
Jika kami memiliki kelas pengontrol untuk pandangan kami, kelas akan disebut HelloWorld . Lebih lanjut tentang itu di bab berikutnya. Untuk menggunakan komponen kami dalam proses proses, kami harus meminta modul untuk itu dan itu akan menemukan dan menginisialisasi untuk kami.
<?php
namespace ProcessWire ;
// Get a new instance of our HelloWorld-component:
$ myComponent = wire ( ' twack ' )-> getNewComponent ( ' HelloWorld ' );
?>
<html>
<head>
<title>Hello World!</title>
</head>
<body>
<?php
// Render the component`s view:
echo $ myComponent -> render ();
?>
</body>
</html>Seperti yang Anda lihat, termasuk komponen twack dalam proses-templat tradisional cukup sederhana. Anda dapat membangun HTML lengkap dalam pandang twack dan menggunakan potensi penuhnya, tetapi Anda tidak perlu melakukannya. Dimungkinkan untuk secara bertahap mengganti bagian -bagian setiap halaman.
Mari kita kembali ke komponen kita. Anda membuat komponen HelloWorld Anda dengan apa-apa selain pandangan yang menghasilkan "Hello World!" Sebagian besar komponen membutuhkan lebih dari sekedar output. Kami membutuhkan pengontrol untuk membuat tampilan lebih dinamis.
Buat site/templates/components/hello_world/ dan pindahkan file view kami ke tujuan ini. Selain itu buat file controller dengan nama hello_world.class.php di direktori baru ini.
Twack-controller membutuhkan sedikit boilerplate-code untuk berfungsi dengan benar. Salin kode berikut ke file controller Anda ( hello_world.class.php ):
<?php
namespace ProcessWire ;
class HelloWorld extends TwackComponent {
public function __construct ( $ args ) {
parent :: __construct ( $ args );
}
} Setiap pengontrol twack harus memperluas twackcomponent umum kami, yang membawa banyak fungsi latar belakang ke pengontrol kami. Dengan parent::__construct($args); Kami membiarkan orang tua TwackComponent menyelesaikan pekerjaan inisialisasi umumnya sebelum kode komponen khusus kami akan dieksekusi.
Dalam konstruktor kami, kami akan mendefinisikan variabel, menambahkan komponen anak dan melakukan semua pekerjaan logis untuk tampilan.
Pengontrol yang sedikit lebih canggih bisa terlihat seperti ini:
<?php
namespace ProcessWire ;
class HelloWorld extends TwackComponent {
public function __construct ( $ args ) {
parent :: __construct ( $ args );
$ this -> title = ' Hello World! ' ;
if ( isset ( $ args [ ' title ' ])) {
$ this -> title = $ args [ ' title ' ];
}
// Add and initialise a child-component
$ testChildArgs = [
' myTestValue '
];
$ this -> addComponent ( ' TestChild ' , $ testChildArgs );
}
} $this->title akan menjadi "Hello World!", Selama kami tidak mendapatkan nilai untuk $args['title'] dari parameter $args konstruktor kami. Jika kami telah menginisialisasi komponen dengan $twack->getNewComponent('HelloWorld', ['title' => 'My new Title.']); , kami akan mengaturnya ke nilai baru ini.
Setiap atribut pengontrol juga dapat diakses dalam tampilan, Anda tidak perlu peduli untuk mentransfer nilai.
Komponen anak dapat ditambahkan melalui $this->addComponent() . Dalam contoh kami, kami menambahkan komponen 'TestChild', yang harus ditempatkan di bawah site/templates/components/hello_world/test_child/test_child.class.php . Twack secara otomatis terlihat di direktori komponen saat ini untuk subdirektori. Menentukan jalur lain juga dimungkinkan. Saya membuat array $testChildArgs untuk menunjukkan lulus parameter tambahan ke TestChild , yang akan diteruskan ke konstruktornya.
Pandangan baru kami bisa terlihat seperti ini:
<?php
namespace ProcessWire ;
?>
<div class="hello_world_component">
<?php
if (! empty ( $ this -> showTitle )){
echo " <h2> { $ this -> showTitle } </h2> " ;
}
?>
<p>Lorem ipsum</p>
<div class="children_wrapper">
<?php
foreach ( $ this -> childComponents as $ childComponent ) {
echo ( string ) $ childComponent ;
}
?>
</div>
</div> Seperti yang Anda lihat, kami hanya menampilkan judulnya, jika $this->title memiliki nilai. Di bawah $this->childComponents Kami memiliki daftar semua komponen yang ditambahkan melalui $this->addComponent() di controller.
Kami sekarang telah membuat komponen twack dasar dan Anda sekarang konsep umum bagaimana cwack bekerja. Tetapi Twack memiliki banyak fitur hebat yang akan mengeluarkan dan menyederhanakan proses pengembangan Anda.
lang Opsional, tambahkan banyak kode langugage yang dapat digunakan sebagai jalan pintaslang opsional untuk memilih bahasa di lingkungan multilangwire('twack') . (Terima kasih untuk @BernhardBaumrock) Kami menggunakan SEMVER untuk versi. Untuk versi yang tersedia, lihat tag di repositori ini.
Proyek ini dilisensikan di bawah Lisensi Publik Mozilla Versi 2.0 - lihat file lisensi.md untuk detailnya.
➡️ Lanjutkan dengan 2: Penamaan Konvensi & Varian Komponen
