مكونات قابلة لإعادة الاستخدام لعلاج العملية الخاصة بك!
مرحبًا بك في Twack! يساعدك TWACK في بناء مشاريع عملية جيدة التنظيم ويمكن للصيانة. مستوحاة من Angular.
| وحدة ProcessWire: | https://modules.processwire.com/modules/twack/ |
| دعم الدعم: | https://processwire.com/talk/topic/23549-twack/ |
| مستودع: | https://github.com/sebiworld/twack |
| ويكي: | https://github.com/sebiworld/twack/wiki/ |
يمكن تثبيت Twack مثل كل وحدة أخرى في ProcessWire. تحقق من الدليل التالي للحصول على معلومات مفصلة: كيفية تثبيت أو إلغاء تثبيت الوحدات النمطية
المتطلبات المسبقة هي php> = 5.5.0 وإصدار ProcessWire> = 3.0.0 . ومع ذلك ، يتم فحص هذا أيضا أثناء تثبيت الوحدة النمطية. لا تبعيات أخرى.
يستخدم Twack مكونات لتقسيم الموقع إلى مكونات منطقية. يمكن للمكون النموذجي أن يقف على حد سواء وليس له تبعيات ، مما يجعله قابل لإعادة الاستخدام وسهلة الصيانة. تتكون معظم المكونات من وحدة تحكم وعرض.
إذا لم تكن قد انتهيت ، قم بإنشاء دليل site/templates/components . هنا سنضع جميع مكوناتنا المستقبلية. إضافة ملف جديد hello_world.view.php داخل الدليل. قم بإنشاء site/templates/services حيث ستجد جميع فصول الخدمة الخاصة بنا منزلًا.
افتح الملف واملأ المحتويات التالية:
<?php
namespace ProcessWire ;
?>
<h2>Hello World!</h2>لقد تم ذلك! لدينا أول مكون أداء لدينا. من المسلم به أن المكون يتكون من وجهة نظر واحدة فقط ، ولكن حتى بالنسبة للمكونات البسيطة ، هناك العديد من الأغراض المفيدة. سنضيف معالجة البيانات والوظائف في لحظة. لكن أولاً ، دعنا نتعلم كيفية استخدام مكوننا في أحد أوجه العمليات الخاصة بنا.
إذا كان لدينا فئة وحدة تحكم من وجهة نظرنا ، فسيتم تسمية الفصل HelloWorld . المزيد عن ذلك في الفصل التالي. لاستخدام مكوننا في معالجة ProcessWire-Template ، علينا أن نطلب من وحدة Twack الخاصة به وسيجدنا وتهيئتها لنا.
<?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>كما ترون ، بما في ذلك مكون من العناصر المتراكمة في تمييز العملية التقليدية أمر بسيط للغاية. يمكنك إنشاء HTML الكامل في وجهات نظر Twack واستخدام إمكاناته الكاملة ، ولكن ليس عليك ذلك. من الممكن استبدال الأجزاء الفردية للصفحة تدريجياً.
دعنا نعود إلى مكوننا. لقد قمت بإنشاء المكون HelloWorld الخاص بك مع أي شيء سوى رؤية يخرج "Hello World!". تحتاج معظم المكونات إلى أكثر من مجرد إخراج. نحتاج إلى وحدة تحكم لجعل العرض أكثر ديناميكية.
قم بإنشاء site/templates/components/hello_world/ ونقل ملف العرض الخاص بنا إلى هذه الوجهة. بالإضافة إلى ذلك ، قم بإنشاء ملف وحدة تحكم مع اسم hello_world.class.php في هذا الدليل الجديد.
يحتاج جهاز التحكم twack إلى القليل من الرموز المليئة بالملل للوظيفة بشكل صحيح. انسخ الرمز التالي إلى ملف وحدة التحكم الخاص بك ( hello_world.class.php ):
<?php
namespace ProcessWire ;
class HelloWorld extends TwackComponent {
public function __construct ( $ args ) {
parent :: __construct ( $ args );
}
} يتعين على كل سيطرة Twack توسيع General TwackComponent ، مما يجلب الكثير من الوظائف الخلفية إلى وحدة التحكم الخاصة بنا. مع parent::__construct($args); لقد تركنا الوالدين TwackComponent إنهاء أعمال التهيئة العامة قبل تنفيذ رمز مكوننا المخصص.
في مُنشئنا ، سنحدد المتغيرات ، وأضف موافقات الأطفال ونقوم بكل الأعمال المنطقية للعرض.
يمكن أن تبدو وحدة تحكم أكثر تقدمًا مثل هذا:
<?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 "Hello World!" ، طالما أننا لا نحصل على أي قيمة لـ $args['title'] من المعلمة $args الخاصة بمنشئنا. إذا كنا قد قمنا بتهيئة المكون باستخدام $twack->getNewComponent('HelloWorld', ['title' => 'My new Title.']); ، سنقوم بتعيينه على هذه القيمة الجديدة.
يمكن الوصول إلى كل سمة من سمات وحدة التحكم أيضًا في العرض ، ولا يتعين عليك الاهتمام بنقل القيم.
يمكن إضافة مكون الطفل عبر $this->addComponent() . في مثالنا ، نضيف المكون "TestChild" ، والذي يجب أن يكون موجودًا تحت site/templates/components/hello_world/test_child/test_child.class.php . يبحث TWACK تلقائيًا في دليل المكون الحالي للدليل الفرعي. تحديد مسار آخر ممكن أيضا. لقد قمت بإنشاء صفيف $testChildArgs لإظهار معلمات إضافية إلى TestChild ، والتي سيتم نقلها إلى مُنشئها.
قد تبدو وجهة نظرنا الجديدة هكذا:
<?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> كما ترى ، نعرض فقط العنوان ، إذا كان $this->title له قيمة. تحت $this->childComponents لدينا قائمة بجميع المكونات التي تمت إضافتها عبر $this->addComponent() في وحدة التحكم.
لقد أنشأنا الآن مكونًا أساسيًا من العناصر المتواضعة وأنت الآن المفاهيم العامة كيف يعمل Twack. لكن Twack لديها الكثير من الميزات الرائعة التي ستنبعث وتبسيط عملية التطوير الخاصة بك.
lang param الاختياري ، أضف العديد من رموز langugage التي يمكن استخدامها كاختصارlang Param الاختياري لتحديد لغة في بيئات متعددةwire('twack') . (بفضل bernhardbaumrock) نستخدم Semver للنسخة. للحصول على الإصدارات المتاحة ، راجع العلامات الموجودة على هذا المستودع.
تم ترخيص هذا المشروع بموجب الإصدار 2.0 ترخيص Mozilla - راجع ملف الترخيص.
➡ متابعة مع 2: تسمية الاتفاقيات ومتغيرات المكونات