z***@sohu.com
z***@sohu.com
  • 发布:2023-06-05 14:14
  • 更新:2024-03-27 11:20
  • 阅读:1921

uni-data-select 数据回显不了

分类:uni-app
<template>  
    <view>  
        <uni-forms ref="formRef" :rules="formRules" :modelValue="formData">  
            <uni-forms-item label="证件类型" required name="id_type" labelWidth="180rpx">  
                <uni-data-select :disabled="disableStatus" v-model="formData.id_type" :localdata="idType"  
                    placeholder="请选证件类型">  
                </uni-data-select>  
            </uni-forms-item>  
        </uni-forms>  
    </view>  
</template>  

<script>  
    import {  
        psdTypeGetValue  
    } from "@/components/request/zl_base/staticData.js"  

    import {  
        queryUserInfo  
    } from "@/components/request/zl_property_wx/user.js"  

    export default {  
        data() {  
            return {  
                formData: {  
                    id_type: 1,  
                },  
                idType: [],  
            }  
        },  

        onShow() {  
            this.init();  
        },  

        methods: {  
            async init() {  
                try {  
                    await this.getStaticData();  
                } catch (err) {  
                    console.error(err);  
                }  
            },  

            async getStaticData() {  
                try {  
                    const res = await psdTypeGetValue(); //后端接口  
                    res.datalist.map((item) => {  
                        this.idType.push({  
                            value: item.static_data_value_id,  
                            text: item.static_data_value_name,  
                        });  
                    });  
                    console.log(res.datalist)  
                    console.log(this.idType[0].value, typeof(this.idType[0].value))  
                    this.get_user_info()  
                } catch (err) {  
                    console.error(err);  
                }  
            },  

            //获取用户资料  
            async get_user_info() {  
                try {  
                    const res = await queryUserInfo() //后端接口  
                    if (res.errMsg == "ok") {  
                        // this.formData.id_type = result[0].id_type  
                        this.$nextTick(() => {  
                            this.formData.id_type = result[0].id_type  
                            console.log(this.formData.id_type, typeof(this.formData.id_type))  
                                                        console.log(this.formData.id_type ==typeof(this.idType[0].value))  
                        });  
                    } else {  
                        uni.showToast({  
                            title: '获取用户资料失败',  
                            icon: "none"  
                        })  
                    }  
                } catch (err) {  
                    console.error(err);  
                }  
            },  
        },  
    }  
</script>

console.log( res.datalist)打印输出:
[{…}]
0: {static_data_value_id: 1, static_data_value_name: "身份证"}

console.log( this.idType[0].value, typeof(this.idType[0].value))打印输出:
1 number

console.log(this.formData.id_type, typeof(this.formData.id_type))打印输出:
1 "number"

console.log(this.formData.id_type ==typeof(this.idType[0].value))打印输出:
true

另外尝试过,formData: {
id_type: 1,
},

去掉调用get_user_info()去给id_type赋值,只执行getStaticData,从后端获取下拉选项的值。

不管哪种方式,下拉选项正常,选择后,也可以出现在文本框里面。但是指定了id_type的值,就是无法直接回显。页面上其他
uni-easyinput的字段都回显正常。

上面贴出的代码,精简了与此问题无关的代码。

2023-06-05 14:14 负责人:无 分享
已邀请:
yuhespace

yuhespace - Yule

在赋值中:this.formData.id_type = result[0].id_type ,由于页面显示是通过formData.id_type

可以尝试修改this.formData,将其赋值给一个新对象,而不要使用这种

困难总比办法多

困难总比办法多

对象要用this.$set赋值

x***@163.com

x***@163.com - Leo

请问 解决了吗

要回复问题请先登录注册