使用ivx实现移动端单选功能的经验总结

单选选择器是各种案例中都经常会使用到一种功能，本经验总结将介绍3种做单选功能的方式。

一、下拉菜单

1、添加一个下拉菜单组件，它位于拓展组件的交互与表单类中。添加之后在选项列表中输入选项并用英文逗号隔开（数据绑定的话可以绑定一个一维数组）。

2、或者选中下拉菜单，打开自定义选项，再点击拓展组件添加下拉菜单选项，定义好每个下拉菜单选项的内容。

二、手机单项选择器

1、使用手机单项选择器组件。手机单项选择器也是拓展组件的一种，位于拓展组件中选择器类。

3、要注意的是本身单项选择器是不显示的，其初始状态为隐藏。这里我们给文本组件添加了一个事件，点击文本组件使选择器显示。

三、循环创建

1、使用循环创建，循环创建需要数组来作为数据来源，我们先将数据写入一维数组之中，然后进行数据绑定。至此就可以把选项都创建出来，效果如图。

3、最后就是使选中选项的显示效果能与其它选项区别开来。这里使用了三元表达式，当前数据就是每个文本组件显示的11,22,33等等，“选中的内容”是11,22,33等选项中的一个，即我们之前点击的那个文本组件的当前数据1。每个文本组件会判断自己的当前数据1与“选中的内容”是否相等，相等则背景颜色显示蓝色#5FA2DD，文字颜色显示#FFFFFF，不相等则背景颜色显示空，即透明，字体颜色显示灰色#999999。