README

此捆绑包的目标是什么？

将自定义功能导入sulu，在本例中，为自定义内容类型。此捆绑包将导入范围输入。使用的范围输入来自react-range。

安装

转到您的 assets/admin 文件夹并安装 react-switch npm 包 npm i react-range。
使用以下命令行在您的项目中下载软件包
composer require sevengroupfrance/sulu-range-bundle.
在 config/bundles.php 中添加以下代码
SevenGroupFrance\SuluRangeBundle\SuluRangeBundle::class => ['all' => true].
在 assets/admin/package.json 中，在 "dependencies" 对象中添加以下行
"sulu-range-bundle": "file:node_modules/@sulu/vendor/sevengroupfrance/sulu-range-bundle/src/Resources/js".
在 assets/admin 中，运行 npm install 以初始化捆绑包的符号链接目录。
在 assets/admin/index.js 中，添加此行
import 'sulu-range-bundle'.
在 assets/admin 中，运行 npm run watch 或 npm run build

在模板文件中使用

安装后，要使用此新内容类型，您必须创建一个新的类型为 sulu_range 的属性。

<property name="size" type="sulu_range">
  <meta>
    <title lang="en">Block size</title>
  </meta>
</property>

设置步长、最小值和最大值

从 v1.0.1 开始，您可以配置自己的基本值。为此，您需要在 sulu xml 文件模板中设置几个 parameters。

<property name="size" type="sulu_range">
  <meta>
    <title lang="en">Block size</title>
  </meta>
  <params>
    <param name="min" value="20" />
  </params>
</property>

以下参数可用
min(数字): 设置最小值（与 html 范围输入中的 min 属性相同）
max(数字): 设置最大值（与 html 范围输入中的 max 属性相同）
step(数字): 设置步长值（与 html 范围输入中的 step 属性相同）
ratio(布尔值): 设置输出如何显示

如果设置为 true，则 ratio 参数将像这样显示输出

有关进一步设置，请参阅 react-range GitHub 的 README

sevengroupfrance / sulu-range-bundle

维护者

详细信息

README

此捆绑包的目标是什么？

安装

在模板文件中使用

设置步长、最小值和最大值