【报Bug】uni-data-select与uni-forms界面冲突

分类：uni-app

bug反馈

产品分类： uniapp/H5

PC开发环境操作系统： Windows

PC开发环境操作系统版本号： win7

HBuilderX类型：正式

HBuilderX版本号： 3.4.15

浏览器平台： Chrome

浏览器版本： 103.0.5060.53

项目创建方式： HBuilderX

示例代码：

        <uni-forms>  
            <uni-forms-item label="AAAA BBBB" name="name">  
                <uni-data-select v-model="selectVal" :localdata="selectRange"></uni-data-select>  
            </uni-forms-item>  
        </uni-forms>  

/////  

        data() {  
            return {  
                selectVal : 'XXX',  
                selectRange : [{value:'XXX',text:'XXX'}],  
            }  
        },

操作步骤：

.

预期结果：

.

实际结果：

.

bug描述：

文字标签排版混乱，上下不对齐，选择器超出屏幕外(iPhone7尺寸)。
底层原因是uni-data-select宽度使用了静态宽度的原因。

.uni-select__input-text {  
        width: 280px;  
}

2022-06-28 15:36 负责人:无分享

2 个回复

c***@126.com (作者)

<view class="uni-select" :style="boxStyles">  

/// props  
            boxStyles: {  
                type : Object,  
                default: {  
                    width: '100%',  
                }  
            },  

//////  

    .uni-stat__select{  
        margin: 0 10px;  
        padding: initial; // remove padding  
    }  
    .uni-stat__select, .uni-select{  
        // flex: 1; // width: 100%;  
        // props:boxStyles  
    }  
    .uni-select__input-text{  
        width: initial; // remove width  
    }  
    .uni-select__input-box{  
        justify-content: space-between;  
    }  
    .uni-select__selector{  
        width: max-content;  
    }

c***@126.com (作者)

为啥论坛只能编辑主题，却不能编辑回复的，好差评。。。。
还得自己F12黑科技编辑了才能删除回复，然后再重新发回复。。

要回复问题请先登录或注册

【报Bug】uni-data-select与uni-forms界面冲突

示例代码：

`<uni-forms> <uni-forms-item label="AAAA BBBB" name="name"> <uni-data-select v-model="selectVal" :localdata="selectRange"></uni-data-select> </uni-forms-item> </uni-forms> ///// data() { return { selectVal : 'XXX', selectRange : [{value:'XXX',text:'XXX'}], } },`

操作步骤：

.

预期结果：

.

实际结果：

.

bug描述：

2 个回复

公告

相关问题

【报Bug】uni-data-select与uni-forms界面冲突

示例代码： <uni-forms> <uni-forms-item label="AAAA BBBB" name="name"> <uni-data-select v-model="selectVal" :localdata="selectRange"></uni-data-select> </uni-forms-item> </uni-forms> ///// data() { return { selectVal : 'XXX', selectRange : [{value:'XXX',text:'XXX'}], } },

操作步骤： .

预期结果： .

实际结果： .

bug描述：

与内容相关的链接

2 个回复

公告

相关问题

示例代码：

`<uni-forms> <uni-forms-item label="AAAA BBBB" name="name"> <uni-data-select v-model="selectVal" :localdata="selectRange"></uni-data-select> </uni-forms-item> </uni-forms> ///// data() { return { selectVal : 'XXX', selectRange : [{value:'XXX',text:'XXX'}], } },`

操作步骤：

.

预期结果：

.

实际结果：

.