ProcessWire-Templates用の再利用可能なコンポーネント!
Twackへようこそ! Twackは、適切に構造化され、保守可能なProcessWire-Projectを構築するのに役立ちます。 Angularに触発されました。
| ProcessWire-Module: | 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はコンポーネントを使用して、Webサイトを論理コンポーネントに分割します。典型的なコンポーネントは、独自の耐えられ、依存関係がないため、再利用可能で保守が容易になります。ほとんどのコンポーネントは、コントローラーとビューで構成されています。
site/templates/componentsディレクトリを作成していない場合。ここでは、将来のすべてのコンポーネントを配置します。ディレクトリ内に新しいファイルhello_world.view.phpを追加します。すべてのサービスクラスが家を見つけるsite/templates/servicesを作成します。
ファイルを開き、次の内容を入力します。
<?php
namespace ProcessWire ;
?>
<h2>Hello World!</h2>それは終わった!最初の機能コンポーネントがあります。確かに、コンポーネントは1つのビューのみで構成されていますが、単純なコンポーネントであっても、多くの有用な目的があります。データ処理と機能をすぐに追加します。ただし、最初に、プロセスワイヤーテンプレートの1つでコンポーネントを使用する方法を学びましょう。
私たちの見解のためにコントローラークラスを持っていた場合、クラスはHelloWorldと呼ばれます。次の章の詳細について。コンポーネントをProcessWire-Templateで使用するには、Twack-Moduleに依頼する必要があります。
<?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>ご覧のとおり、従来のProcessWire-TemplatesのTWACKコンポーネントを含めることは非常に簡単です。完全なHTMLをTwack-Viewsで構築し、その最大限の可能性を使用できますが、必要はありません。ページの個々の部分を徐々に交換することができます。
コンポーネントに戻りましょう。あなたは、大胆な「Hello World!」を出力するビューだけで、Helloworld-Componentを作成しました。ほとんどのコンポーネントには、単なる出力以上のものが必要です。ビューをよりダイナミックにするには、コントローラーが必要です。
新しいディレクトリsite/templates/components/hello_world/を作成し、この宛先にビューファイルを移動します。さらに、この新しいディレクトリにhello_world.class.phpという名前のコントローラーファイルを作成します。
Twack-Controllerは、正しく機能するために少しのボイラープレートコードを必要とします。次のコードをコントローラーファイル( hello_world.class.php )にコピーします。
<?php
namespace ProcessWire ;
class HelloWorld extends TwackComponent {
public function __construct ( $ args ) {
parent :: __construct ( $ args );
}
} Twack-Controllerごとに、一般的なTwackComponentを拡張する必要があります。これにより、多くのバックグラウンド機能性がコントローラーにもたらされます。 parent::__construct($args);カスタムコンポーネントのコードが実行される前に、Parent 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パラメーターから$args['title']の価値がない限り。コンポーネント$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の仕組みを一般的に概念にしています。しかし、Twackには、開発プロセスを修正および簡素化する多くの優れた機能があります。
lang Paramを改善し、ショートカットとして使用できる多くのLangugageコードを追加しますlang Paramを追加して、マルチラング環境で言語を選択しますwire('twack')としてTwackを利用可能にしました。 (@bernhardbaumrockに感謝) バージョン化にはSemverを使用しています。利用可能なバージョンについては、このリポジトリのタグを参照してください。
このプロジェクトは、Mozilla Public Licenseバージョン2.0でライセンスされています。詳細については、license.mdファイルを参照してください。
➡️2:命名規則とコンポーネントバリアントを続けます