coderius/yii2-pell-widget

为Yii2的Pell内容编辑器小部件。

安装数量: 6,454

依赖者: 0

建议者: 0

安全: 0

星级: 3

关注者: 2

分支: 0

开放问题: 0

类型:yii2-extension

1.0.1 2019-11-18 15:34 UTC

This package is auto-updated.

Last update: 2024-09-19 01:56:00 UTC


README

Latest Version Software License Code Coverage Code Quality Code Intelligence Status Build Status Build Status travis

渲染一个Pell WYSIWYG文本编辑器插件小部件。

Live demo

安装

安装此扩展的首选方式是通过composer

运行

composer require coderius/yii2-pell-widget:"~1.0"

或者将以下内容添加到应用程序的composer.json文件的require部分:

"coderius/yii2-pell-widget" : "~1.0"

使用方法

例如,要使用pell编辑器与一个[[\yii\base\Model|模型]]

echo Pell::widget([
   'model' => $model,
   'attribute' => 'text',
]);

在无模型的表单内

$value = 'textarea some content';

echo \coderius\pell\Pell::widget([
   'name' => 'textarea-name',
   'value'  => $value,
   'clientOptions' =>[]
]);

以下示例将不会作为表单元素使用

echo Pell::widget([
  'asFormPart'  => false,
  'value'  => $value,
  'clientOptions' =>[
      'onChange' => new JsExpression(
          "html => {
              console.log(html);
          },"
      )
  ]
]);

您也可以使用此小部件在[[\yii\widgets\ActiveForm|ActiveForm]]中,通过[[\yii\widgets\ActiveField::widget()|小部件()]]方法,例如这样

use coderius\pell\Pell;

<?= $form->field($model, 'text')->widget(Pell::className(), []);?>

关于ClientOptions

请记住,如果您需要在js插件的配置中添加JavaScript,并且需要它是纯JS,请使用JsExpression类。这个类是Yii为了这个特定目的而创建的。例如

// Having the following scenario
<script> 
    function jsFunctionToBeCalled() {
        // ...
    }
</script>

<?= $form->field($model, 'content')->widget(Pell::className(), [
        'clientOptions' => [
            'defaultParagraphSeparato' => 'div',

            // ...

            'actions' => [
                'bold',
                'italic',
                'underline',
                'strikethrough',
                'heading1',
                'heading2',
                'paragraph',
                'quote',
                'olist',
                'ulist',
                'code',
                'line',
                'link',
                'image',
                [
                    'name'   => 'backColor',
                    'icon'   => '<div style="background-color:pink;">A</div>',
                    'title'  => 'Highlight Color',
                    // this will render the function name without quotes on the configuration options of the plugin
                    'result' => new JsExpression('jsFunctionToBeCalled')
                ],
            ],
            
            // ...
        ]
        
    ]
]); ?>

小部件使用示例

请参阅yii2视图文件中的使用示例以获取更多示例。

测试

$ phpunit

更多信息

请查看Pell插件github文档,以获取有关其配置选项的更多信息。

贡献

请查看贡献指南以获取详细信息。

鸣谢

许可

MIT许可(MIT)。有关更多信息,请参阅许可文件

网络开发从未如此有趣!
coderius.biz.ua