1.如官网示例(只有点击右侧箭头才会出现弹出框,点击input无反应)
2.需求是点击input处也要弹出弹框,示例代码如下,只需要在u-input上加上 style="pointer-events: none;"即可;看文档pointer-events属性有点击击穿的效果 能透过disabled遮罩层 触发绑定在input的点击事件;
<template>
<view>
<u--form
labelPosition="left"
:model="model1"
:rules="rules"
ref="uForm"
>
<u-form-item
label="性别"
prop="userInfo.sex"
borderBottom
@click="showSex = true; hideKeyboard()"
ref="item1"
>
<u--input
v-model="model1.userInfo.sex"
style="pointer-events: none;"
disabled
disabledColor="#ffffff"
placeholder="请选择性别"
border="none"
></u--input>
<u-icon
slot="right"
name="arrow-right"
></u-icon>
</u-form-item>
</u--form>
<u-action-sheet
:show="showSex"
:actions="actions"
title="请选择性别"
description="如果选择保密会报错"
@close="showSex = false"
@select="sexSelect"
>
</u-action-sheet>
</view>
</template>