搜索文档 /

ion-segment

分段显示一组相关按钮,有时称为分段控件,在水平行中。它们可以显示在工具栏或主要内容中。

它们的功能类似于选项卡,选择一个将取消所有其他选项。段对于在内容内部的不同视图之间切换很有用。当点击控件在页面之间导航时,应该使用标签而不是段。

使用


                <!——默认段——>
               
                  <
                 ion-segment
                
                 (ionChange)
                  
                  
                 segmentChanged(事件)
                  
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 朋友
                  
                 >
               
                  <
                 ion-label
                 >
               朋友
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 敌人
                  
                 >
               
                  <
                 ion-label
                 >
               敌人
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                <!——禁用段——>
               
                  <
                 ion-segment
                
                 (ionChange)
                  
                  
                 segmentChanged(事件)
                  
                
                 禁用
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 阳光明媚的
                  
                
                 检查
                 >
               
                  <
                 ion-label
                 >
               阳光明媚的
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 多雨的
                  
                 >
               
                  <
                 ion-label
                 >
               多雨的
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                <!——有主持人的片段——>
               
                  <
                 ion-segment
                
                 (ionChange)
                  
                  
                 segmentChanged(事件)
                  
                 >
               
                  <
                 ion-segment-button
                
                 href
                  
                  
                 #狗
                  
                
                 价值
                  
                  
                 
                  
                 >
               
                  <
                 ion-label
                 >
               
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 href
                  
                  
                 #猫
                  
                
                 价值
                  
                  
                 
                  
                 >
               
                  <
                 ion-label
                 >
               
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                <!——可滚动段——>
               
                  <
                 ion-segment
                
                 可滚动
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 首页
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 检查
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 明星
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 调用
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 全球
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 篮子
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                <!——副色段——>
               
                  <
                 ion-segment
                
                 (ionChange)
                  
                  
                 segmentChanged(事件)
                  
                
                 颜色
                  
                  
                 二次
                  
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 标准
                  
                 >
               
                  <
                 ion-label
                 >
               标准
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 混合动力
                  
                 >
               
                  <
                 ion-label
                 >
               混合动力
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 
                  
                 >
               
                  <
                 ion-label
                 >
               卫星
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                <!——工具栏中的段——>
               
                  <
                 ion-toolbar
                 >
               
                  <
                 ion-segment
                
                 (ionChange)
                  
                  
                 segmentChanged(事件)
                  
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 相机
                  
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 相机
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 书签
                  
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 书签
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                  
                 ion-toolbar
                 >
               
                <!——段与默认选择——>
               
                  <
                 ion-segment
                
                 (ionChange)
                  
                  
                 segmentChanged(事件)
                  
                
                 价值
                  
                  
                 javascript
                  
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 python
                  
                 >
               
                  <
                 ion-label
                 >
               Python
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 javascript
                  
                 >
               
                  <
                 ion-label
                 >
               Javascript
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >

                进口
               
                
               组件
                
               
                
               
                “@angular /核心”
                
               
                组件
                
                
               选择器
                
               
                “segment-example”
                
               templateUrl
                
               
                “segment-example.html”
                
               styleUrls
                
               
                
                ”。/ segment-example.css '
                
                
               
                
                
               
                出口
               
                
               
                SegmentExample
               
                
               
                segmentChanged
                
                电动汽车
                 
                
                 任何
                
               
                
               
                控制台
                
                日志
                
                “段改变”
                
               电动汽车
                
                
               
                
               
                

                <!——默认段——>
               
                  <
                 ion-segment
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 朋友
                  
                 >
               
                  <
                 ion-label
                 >
               朋友
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 敌人
                  
                 >
               
                  <
                 ion-label
                 >
               敌人
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                <!——禁用段——>
               
                  <
                 ion-segment
                
                 禁用
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 阳光明媚的
                  
                
                 检查
                 >
               
                  <
                 ion-label
                 >
               阳光明媚的
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 多雨的
                  
                 >
               
                  <
                 ion-label
                 >
               多雨的
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                <!——有主持人的片段——>
               
                  <
                 ion-segment
                 >
               
                  <
                 ion-segment-button
                
                 href
                  
                  
                 #狗
                  
                
                 价值
                  
                  
                 
                  
                 >
               
                  <
                 ion-label
                 >
               
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 href
                  
                  
                 #猫
                  
                
                 价值
                  
                  
                 
                  
                 >
               
                  <
                 ion-label
                 >
               
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                <!——可滚动段——>
               
                  <
                 ion-segment
                
                 可滚动
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 首页
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 检查
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 明星
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 调用
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 全球
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 篮子
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                <!——副色段——>
               
                  <
                 ion-segment
                
                 颜色
                  
                  
                 二次
                  
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 标准
                  
                 >
               
                  <
                 ion-label
                 >
               标准
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 混合动力
                  
                 >
               
                  <
                 ion-label
                 >
               混合动力
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 
                  
                 >
               
                  <
                 ion-label
                 >
               卫星
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                <!——工具栏中的段——>
               
                  <
                 ion-toolbar
                 >
               
                  <
                 ion-segment
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 相机
                  
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 相机
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 书签
                  
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 书签
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                  
                 ion-toolbar
                 >
               
                <!——段与默认选择——>
               
                  <
                 ion-segment
                
                 价值
                  
                  
                 javascript
                  
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 python
                  
                 >
               
                  <
                 ion-label
                 >
               Python
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 javascript
                  
                 >
               
                  <
                 ion-label
                 >
               Javascript
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >

                //监听所有段的ionChange
               
                常量
               
                
               文档
                
                querySelectorAll
                
                “ion-segment”
                
               
                
               
                
                
               
                
               
                0
                
               
                <
               
                
               长度
                
               
                ++
                
               
                
               
                
               
                
                
                addEventListener
                
                “ionChange”
                
               
                
                电动汽车
                
               
                =>
               
                
               控制台
                
                日志
                
                “段改变”
                
               电动汽车
                
                
               
                
                
               
                

                进口
               反应
                
               
                “反应”
                
               
                进口
               
                
               IonSegment
                
               IonSegmentButton
                
               IonLabel
                
               betway东盟体育appIonIcon
                
               IonToolbar
                
               IonContent
                
               
                
               
                “@betway东盟体育appionic /反应”
                
               
                出口
               
                常量
               SegmentExample
                
               反应
                
                足球俱乐部
               
                
               
                
                
               
                =>
               
                
               
                  <
                  IonContent
                 >
                
                
                /*——默认段——*/
                
                
                  <
                  IonSegment
                
                 onIonChange
                  
                  
                  e
                 
                  =>
                 
                  控制台
                  
                  日志
                  
                  “段选择”
                  
                 e
                  
                 细节
                  
                 价值
                  
                  
                 >
                
                  <
                  IonSegmentButton
                
                 价值
                  
                  
                 朋友
                  
                 >
                
                  <
                  IonLabel
                 >
                朋友
                  
                  IonLabel
                 >
                
                  
                  IonSegmentButton
                 >
                
                  <
                  IonSegmentButton
                
                 价值
                  
                  
                 敌人
                  
                 >
                
                  <
                  IonLabel
                 >
                敌人
                  
                  IonLabel
                 >
                
                  
                  IonSegmentButton
                 >
                
                  
                  IonSegment
                 >
                
                
                /*——禁用段——*/
                
                
                  <
                  IonSegment
                
                 onIonChange
                  
                  
                  e
                 
                  =>
                 
                  控制台
                  
                  日志
                  
                  “段选择”
                  
                 e
                  
                 细节
                  
                 价值
                  
                  
                
                 禁用
                 >
                
                  <
                  IonSegmentButton
                
                 价值
                  
                  
                 阳光明媚的
                  
                
                 检查
                 >
                
                  <
                  IonLabel
                 >
                阳光明媚的
                  
                  IonLabel
                 >
                
                  
                  IonSegmentButton
                 >
                
                  <
                  IonSegmentButton
                
                 价值
                  
                  
                 多雨的
                  
                 >
                
                  <
                  IonLabel
                 >
                多雨的
                  
                  IonLabel
                 >
                
                  
                  IonSegmentButton
                 >
                
                  
                  IonSegment
                 >
                
                
                /*——带有锚的片段——*/
                
                
                  <
                  IonSegment
                
                 onIonChange
                  
                  
                  e
                 
                  =>
                 
                  控制台
                  
                  日志
                  
                  “段选择”
                  
                 e
                  
                 细节
                  
                 价值
                  
                  
                 >
                
                  <
                  IonSegmentButton
                
                 价值
                  
                  
                 
                  
                 >
                
                  <
                  IonLabel
                 >
                
                  
                  IonLabel
                 >
                
                  
                  IonSegmentButton
                 >
                
                  <
                  IonSegmentButton
                
                 价值
                  
                  
                 
                  
                 >
                
                  <
                  IonLabel
                 >
                
                  
                  IonLabel
                 >
                
                  
                  IonSegmentButton
                 >
                
                  
                  IonSegment
                 >
                
                
                /*——可滚动段——*/
                
                
                  <
                  IonSegment
                
                 可滚动
                 >
                
                  <
                  IonSegmentButton
                 >
                
                  <
                  betway东盟体育appIonIcon
                
                 的名字
                  
                  
                 首页
                  
                
                 />
                
                  
                  IonSegmentButton
                 >
                
                  <
                  IonSegmentButton
                
                 检查
                 >
                
                  <
                  betway东盟体育appIonIcon
                
                 的名字
                  
                  
                 
                  
                
                 />
                
                  
                  IonSegmentButton
                 >
                
                  <
                  IonSegmentButton
                 >
                
                  <
                  betway东盟体育appIonIcon
                
                 的名字
                  
                  
                 
                  
                
                 />
                
                  
                  IonSegmentButton
                 >
                
                  <
                  IonSegmentButton
                 >
                
                  <
                  betway东盟体育appIonIcon
                
                 的名字
                  
                  
                 明星
                  
                
                 />
                
                  
                  IonSegmentButton
                 >
                
                  <
                  IonSegmentButton
                 >
                
                  <
                  betway东盟体育appIonIcon
                
                 的名字
                  
                  
                 调用
                  
                
                 />
                
                  
                  IonSegmentButton
                 >
                
                  <
                  IonSegmentButton
                 >
                
                  <
                  betway东盟体育appIonIcon
                
                 的名字
                  
                  
                 全球
                  
                
                 />
                
                  
                  IonSegmentButton
                 >
                
                  <
                  IonSegmentButton
                 >
                
                  <
                  betway东盟体育appIonIcon
                
                 的名字
                  
                  
                 篮子
                  
                
                 />
                
                  
                  IonSegmentButton
                 >
                
                  
                  IonSegment
                 >
                
                
                /*——副色段——*/
                
                
                  <
                  IonSegment
                
                 onIonChange
                  
                  
                  e
                 
                  =>
                 
                  控制台
                  
                  日志
                  
                  “段选择”
                  
                 e
                  
                 细节
                  
                 价值
                  
                  
                
                 颜色
                  
                  
                 二次
                  
                 >
                
                  <
                  IonSegmentButton
                
                 价值
                  
                  
                 标准
                  
                 >
                
                  <
                  IonLabel
                 >
                标准
                  
                  IonLabel
                 >
                
                  
                  IonSegmentButton
                 >
                
                  <
                  IonSegmentButton
                
                 价值
                  
                  
                 混合动力
                  
                 >
                
                  <
                  IonLabel
                 >
                混合动力
                  
                  IonLabel
                 >
                
                  
                  IonSegmentButton
                 >
                
                  <
                  IonSegmentButton
                
                 价值
                  
                  
                 
                  
                 >
                
                  <
                  IonLabel
                 >
                卫星
                  
                  IonLabel
                 >
                
                  
                  IonSegmentButton
                 >
                
                  
                  IonSegment
                 >
                
                
                /*——工具栏中的段——*/
                
                
                  <
                  IonToolbar
                 >
                
                  <
                  IonSegment
                
                 onIonChange
                  
                  
                  e
                 
                  =>
                 
                  控制台
                  
                  日志
                  
                  “段选择”
                  
                 e
                  
                 细节
                  
                 价值
                  
                  
                 >
                
                  <
                  IonSegmentButton
                
                 价值
                  
                  
                 相机
                  
                 >
                
                  <
                  betway东盟体育appIonIcon
                
                 的名字
                  
                  
                 相机
                  
                
                 />
                
                  
                  IonSegmentButton
                 >
                
                  <
                  IonSegmentButton
                
                 价值
                  
                  
                 书签
                  
                 >
                
                  <
                  betway东盟体育appIonIcon
                
                 的名字
                  
                  
                 书签
                  
                
                 />
                
                  
                  IonSegmentButton
                 >
                
                  
                  IonSegment
                 >
                
                  
                  IonToolbar
                 >
                
                
                /*——带有默认选择的段——*/
                
                
                  <
                  IonSegment
                
                 onIonChange
                  
                  
                  e
                 
                  =>
                 
                  控制台
                  
                  日志
                  
                  “段选择”
                  
                 e
                  
                 细节
                  
                 价值
                  
                  
                
                 价值
                  
                  
                 javascript
                  
                 >
                
                  <
                  IonSegmentButton
                
                 价值
                  
                  
                 python
                  
                 >
                
                  <
                  IonLabel
                 >
                Python
                  
                  IonLabel
                 >
                
                  
                  IonSegmentButton
                 >
                
                  <
                  IonSegmentButton
                
                 价值
                  
                  
                 javascript
                  
                 >
                
                  <
                  IonLabel
                 >
                Javascript
                  
                  IonLabel
                 >
                
                  
                  IonSegmentButton
                 >
                
                  
                  IonSegment
                 >
                
                  
                  IonContent
                 >
               
                
                

                  <
                 模板
                 >
               
                <!——默认段——>
               
                  <
                 ion-segment
                
                 @ionChange
                  
                  
                 segmentChanged(事件)
                  
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 朋友
                  
                 >
               
                  <
                 ion-label
                 >
               朋友
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 敌人
                  
                 >
               
                  <
                 ion-label
                 >
               敌人
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                <!——禁用段——>
               
                  <
                 ion-segment
                
                 @ionChange
                  
                  
                 segmentChanged(事件)
                  
                
                 禁用
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 阳光明媚的
                  
                
                 检查
                 >
               
                  <
                 ion-label
                 >
               阳光明媚的
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 多雨的
                  
                 >
               
                  <
                 ion-label
                 >
               多雨的
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                <!——有主持人的片段——>
               
                  <
                 ion-segment
                
                 @ionChange
                  
                  
                 segmentChanged(事件)
                  
                 >
               
                  <
                 ion-segment-button
                
                 href
                  
                  
                 #狗
                  
                
                 价值
                  
                  
                 
                  
                 >
               
                  <
                 ion-label
                 >
               
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 href
                  
                  
                 #猫
                  
                
                 价值
                  
                  
                 
                  
                 >
               
                  <
                 ion-label
                 >
               
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                <!——可滚动段——>
               
                  <
                 ion-segment
                
                 可滚动
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 首页
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 检查
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 明星
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 调用
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 全球
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 篮子
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                <!——副色段——>
               
                  <
                 ion-segment
                
                 @ionChange
                  
                  
                 segmentChanged(事件)
                  
                
                 颜色
                  
                  
                 二次
                  
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 标准
                  
                 >
               
                  <
                 ion-label
                 >
               标准
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 混合动力
                  
                 >
               
                  <
                 ion-label
                 >
               混合动力
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 
                  
                 >
               
                  <
                 ion-label
                 >
               卫星
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                <!——工具栏中的段——>
               
                  <
                 ion-toolbar
                 >
               
                  <
                 ion-segment
                
                 @ionChange
                  
                  
                 segmentChanged(事件)
                  
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 相机
                  
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 相机
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 书签
                  
                 >
               
                  <
                 ion-icon
                
                 的名字
                  
                  
                 书签
                  
                 >
                  
                 ion-icon
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                  
                 ion-toolbar
                 >
               
                <!——段与默认选择——>
               
                  <
                 ion-segment
                
                 @ionChange
                  
                  
                 segmentChanged(事件)
                  
                
                 价值
                  
                  
                 javascript
                  
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 python
                  
                 >
               
                  <
                 ion-label
                 >
               Python
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  <
                 ion-segment-button
                
                 价值
                  
                  
                 javascript
                  
                 >
               
                  <
                 ion-label
                 >
               Javascript
                  
                 ion-label
                 >
               
                  
                 ion-segment-button
                 >
               
                  
                 ion-segment
                 >
               
                  
                 模板
                 >
               
                  <
                 脚本
                
                 
                  
                  
                 ts
                  
                 >
                 
                  进口
                 
                  
                 组件
                  
                 Vue
                  
                 
                  
                 
                  “vue-property-decorator”
                  
                 
                  组件
                  
                  
                 
                  出口
                 
                  默认的
                 
                  
                 
                  例子
                 
                  扩展
                 
                  Vue
                 
                  
                 
                  segmentChanged
                  
                  电动汽车
                   
                  任何
                  
                 
                  
                 控制台
                  
                  日志
                  
                  “段改变”
                  
                 电动汽车
                  
                  
                 
                  
                 
                  
                 
                  
                 脚本
                 >

属性

颜色

描述

应用程序调色板中要使用的颜色。默认的选项是:“主”“二级”“三级”“成功”“警告”“危险”“光”“媒介”,“黑暗”.有关颜色的更多信息,请参见主题

属性 颜色
类型 字符串|未定义

禁用

描述

如果真正的时,用户不能与段进行交互。

属性 禁用
类型 布尔
默认的

模式

描述

模式决定使用哪种平台样式。

属性 模式
类型 “ios”|“医学博士”

可滚动

描述

如果真正的,分段按钮将溢出,用户可以滑动查看。

属性 可滚动
类型 布尔
默认的

价值

描述

段的值。

属性 价值
类型 Null | string | undefined

事件

的名字 描述
ionChange 当value属性更改时触发。
查看源代码
Baidu