• cascade 级联
  • 属性说明
  • 示例
    • 代码示例

cascade 级联

解释：多级选择组件，为开发者提供级联选择功能，默认为三级。比如：省/市/区。该组件包括左侧标签栏，以及右侧多个 picker（从底部弹起的滚动选择器）。支持配置左侧标签宽度，并提供自定义样式，可供开发者进行定制。

成都创新互联公司成立于2013年，先为赤壁等服务建站，赤壁等地企业，进行企业商务咨询服务。为赤壁企业网站制作PC+手机+微官网三网同步一站式服务解决您的所有建站问题。

属性说明

示例

跳转编辑工具

在开发者工具中打开

在 WEB IDE 中打开

扫码体验

代码示例

请使用百度APP扫码

代码示例

• SWAN
• JS
• CSS
• JSON

 
 
 

  
  
  

  
  
  

  
  
  
 range="{{multiArray1}}"
  
  
  
 label="四字标题"
  
  
  
 range-key="name"
  
  
  
 bind:change="change"
  
  
  
 placeholder="{{['请选择省', '请选择市', '请选择区']}}"
  
  
  
>
  
  
  

  
  
  

  
  
  
 range="{{multiArray2}}"
  
  
  
 label="无下边框""
  
  
  
 range-key="name"
  
  
  
 noborder="true"
  
  
  
 bind:change="change"
  
  
  
>
  
  
  

  
  
  

  
  
  
 range="{{multiArray3}}"
  
  
  
 label="六字标题排版"
  
  
  
 range-key="name"
  
  
  
 label-width="6em"
  
  
  
 bind:change="change"
  
  
  
 placeholder="{{['请选择省', '请选择市', '请选择区']}}"
  
  
  
>
  
  
  

  
  
  

  
  
  
 range="{{multiArray4}}"
  
  
  
 label="配置未点击时提示"
  
  
  
 range-key="name"
  
  
  
 bind:change="change"
  
  
  
 tips="{{['请选择省', '请选择市', '请选择区']}}"
  
  
  
>
  
  
  

  
  
  

  
  
  
 range="{{multiArray5}}"
  
  
  
 label="回填"
  
  
  
 value="{{[1, 2, 1]}}"
  
  
  
 range-key="name"
  
  
  
 bind:change="change"
  
  
  
 placeholder="{{['请选择省', '请选择市', '请选择区']}}"
  
  
  
>
  
  
  

  
  
  

  
  
  
 range="{{multiArray6}}"
  
  
  
 label="禁用型"
  
  
  
 range-key="name"
  
  
  
 disabled
  
  
  
 bind:change="change"
  
  
  
 placeholder="{{['请选择省', '请选择市', '请选择区']}}"
  
  
  
>
  
  
  

  
  
  

  
  
  
 range="{{multiArray7}}"
  
  
  
 label="externalClasses"
  
  
  
 cascade-picker="cascade-picker"
  
  
  
 cascade-label="cascade-label"
  
  
  
 cascade-content="cascade-content"
  
  
  
 cascade-picker-content="cascade-picker-content"
  
  
  
 range-key="name"
  
  
  
 bind:change="change"
  
  
  
 placeholder="{{['请选择省', '请选择市', '请选择区']}}"
  
  
  
>