+
95
-

微信小程序如何实现单选其它可输入选择框效果?

微信小程序如何实现单选其它可输入选择框效果?

就是可以下拉选择,当选择其它的时候可以输入自定义的文字。

网友回复

+
15
-

在微信小程序中实现单选其它可输入选择框效果,可以通过结合 picker 组件和 input 组件来实现。具体步骤如下:

使用 picker 组件实现下拉选择

picker 组件可以用来实现下拉选择功能。当用户选择“其它”选项时,显示 input 组件供用户输入自定义文字。

使用 input 组件实现自定义输入

input 组件可以用来接收用户的自定义输入。当用户选择“其它”选项时,显示 input 组件,否则隐藏。

以下是一个示例代码,展示了如何实现这一功能:

<!-- index.wxml -->
<view class="container">
  <picker mode="selector" range="{{options}}" value="{{selectedIndex}}" bindchange="onPickerChange">
    <view class="picker">
      {{options[selectedIndex]}}
    </view>
  </picker>
  <input wx:if="{{showInput}}" type="text" placeholder="请输入自定义内容" bindinput="onInputChange" />...

点击查看剩余70%

我知道答案,我要回答