构建组件

namespace Acme\Blog\Components;

class BlogPosts extends \Cms\Classes\ComponentBase
{
    public function componentDetails()
    {
        return [
            'name' => '博客文章',
            'description' => '显示博客文章的集合。'
        ];
    }

    /**
     * 帖子在页面上变为可用 {{ component.posts }}
     */
    public function posts()
    {
        return ['First Post', 'Second Post', 'Third Post'];
    }
}

public function registerComponents()
{
    return [
        \October\Demo\Components\Todo::class => 'demoTodo'
    ];
}

public function defineProperties()
{
    return [
        'maxItems' => [
            'title' => '最大项目',
            'description' => '允许的最多待办事项',
            'default' => 10,
            'type' => 'string',
            'validationPattern' => '^[0-9]+$',
            'validationMessage' => 'Max Items 属性只能包含数字符号'
        ]
    ];
}

$this->property('maxItems');

$this->property('maxItems', 6);

$properties = $this->getProperties();

public function defineProperties()
{
    return [
        'units' => [
            'title' => '单位',
            'type' => 'dropdown',
            'default' => 'imperial',
            'placeholder' => '选择单位',
            'options' => ['metric' => '公制', 'imperial' => '英制']
        ]
    ];
}

public function defineProperties()
{
    return [
        'country' => [
            'title' => '国家',
            'type' => 'dropdown',
            'default' => 'us'
        ]
    ];
}

public function getCountryOptions()
{
    return ['us' => '美国', 'ca' => '加拿大', 'zh-cn' => '中华人民共和国'];
}

public function defineProperties()
{
    return [
        'country' => [
            'title' => '国家',
            'type' => 'dropdown',
            'default' => 'us'
        ],
        'state' => [
            'title' => 'State',
            'type' => 'dropdown',
            'default' => 'dc',
            'depends' => ['country'],
            'placeholder' => '选择一个州'
        ]
    ];
}

public function getStateOptions()
{
    // 从 POST 加载国家属性值
    $countryCode = post('country');

    $states = [
        'ca' => ['ab' => '艾伯塔省', 'bc' => '不列颠哥伦比亚省'],
        'us' => ['al' => '阿拉巴马州', 'ak' => '阿拉斯加州'],
        'zh-cn' => ['hb' => '河北省', 'hk' => '香港特别行政区', 'tw' => '台湾省']
    ];

    return $states[$countryCode];
}

public function defineProperties()
{
        return [
            'postPage' => [
                'title' => '帖子页面',
                'type' => 'dropdown',
                'default' => 'blog/post'
            ]
        ];
}

public function getPostPageOptions()
{
    return Page::sortBy('baseFileName')->lists('baseFileName', 'baseFileName');
}

// 返回 URL 段值，例如：/page/:post_id
$postId = $this->param('post_id');

$this->property('id');

// 返回 "my_custom_parameter"
$this->paramName('id');

public function onRun()
{
    // 当加载页面或布局并将组件附加到它时，将执行此代码。

    $this->page['var'] = 'value'; // 向页面注入一些变量
}

public function init()
{
    $this->addComponent(\Acme\Blog\Components\BlogPosts::class, 'blogPosts');
}

public function onRun()
{
    if (true) {
        return Response::make('拒绝访问!', 403);
    }
}

public function onRun()
{
    if (true) {
        $this->setStatusCode(404);
        return $this->controller->run('404');
    }
}

public function onAddItem()
{
    $value1 = post('value1');
    $value2 = post('value2');
    $this->page['result'] = $value1 + $value2;
}

public function onRender()
{
    // 此代码将在默认组件之前执行
    // 标记呈现在页面或布局上。

    $this->page['var'] = '允许的最大项目数: ' . $this->property('maxItems');
}

$content = $this->renderPartial('@component-partial.htm');

$content = $this->renderPartial('@component-partial.htm', [
    'name' => '约翰·史密斯'
]);

function onGetTemplate()
{
    return ['#someDiv' => $this->renderPartial('@component-partial.htm')];
}

public function onRun()
{
    $content = $this->renderPartial('@default.htm');
    return Response::make($content)->header('Content-Type', 'text/xml');
}

public function onRun()
{
    $this->addJs('/plugins/acme/blog/assets/javascript/blog-controls.js');
}

public function onRun()
{
    $this->addJs('/plugins/acme/blog/assets/javascript/blog-controls.js', [
        'build' => 'Acme.Test',
        'defer' => true
    ]);
}

public function onRun()
{
    $this->addJs('/plugins/acme/blog/assets/javascript/blog-controls.js', 'Acme.Test');
}