@beisen-cmps/platform-years-range 是一款前端类 npm 包，它提供了平台年限区间的展示和选择功能。本文将介绍如何使用该 npm 包。
安装和引入
在项目根目录下执行以下命令安装该 npm 包：
--- ------- --------------------------------- ------
在需要使用该组件的 JS 文件中引入：
------ ------------------ ---- ------------------------------------
使用
使用 PlatformYearsRange 需要在页面中渲染一个 DOM 元素，用于承载组件。组件基本结构如下：
---- --------------------------
使用如下代码初始化组件：
----- -------------- - ------------------------------------------ ----- ------------------ - --- ---------------------------------- - ---- -- ---- --- -------- --- -- ---
以上代码将在 rangeContainer 中渲染平台年限选择组件，并设置可选范围为 110 年，初始默认选中 25 年的区间。
选项
PlatformYearsRange 接收一个选项对象，该对象包含如下属性：
min
类型：number，默认值：1
平台年限的最小值。
max
类型：number，默认值：10
平台年限的最大值。
default
类型：array，默认值：[1, 2]
平台年限的默认选中值，以数组的形式表示选中的区间。例如 [1, 3] 表示选中了 1~3 年的区间。
方法
PlatformYearsRange 除了以上的选项外，还支持以下方法：
getValue()
获取当前选择的平台年限区间，返回一个数组。
----- ----- - ------------------------------ ------------------- -- --- --
setValue(value)
设置平台年限的选中值，传入一个数组表示选中的区间。例如：
------------------------------- ----
示例代码
完整的使用示例代码如下：
--------- -----
------
------
----- ----------------
-------------------------
-------
--------------- -
------ ------
------- ---- -----
-
--------
-------
------
---- --------------------------
------- --------------
------ ------------------ ---- ------------------------------------
----- -------------- - ------------------------------------------
----- ------------------ - --- ---------------------------------- -
---- --
---- ---
-------- --- --
---
------------------------------------------- -- --- --
------------------------------- ----
---------
-------
-------总结
本文介绍了如何使用 @beisen-cmps/platform-years-range 这个 npm 包，包括了安装、引入、选项、方法等方面。希望本文对你有所帮助。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/beisen-cmps-platform-years-range