鍍金池/ 問答/HTML/ antd中Select的defaultValue參數(shù)問題

antd中Select的defaultValue參數(shù)問題

this.state={
    setxzvalue:''
}
 componentWillMount=()=>{
        fetch('/api/user/loadDetail',{
            method:'GET',
            headers:{
                'Content-Type': 'application/json'
            },
            credentials: 'include'
        })
        .then((res)=>res.json())
        .then((res)=>{
            if(res.num == 1){
                this.setState({
                    setradiovalue:res.sex,
                    setxzvalue:res.xz,
                    disabled:true
                })
            }
            console.log(this.state.setxzvalue)
        })
    }
   render(){
    <Select defaultValue={this.state.setxzvalue}></Select>
}

代碼是這樣的,情況是頁面自動加載傳來的res,然后去改變setxzvalue,從而動態(tài)改變select的默認顯示,但是這樣寫沒有效果。。不知道問題出在哪里了
按道理來說setState后render會重新渲染啊,但是defaultValue的值還是空值,在頁面上看不到傳來的res.xz,求大神分析一下原因,萬分感謝!

回答
編輯回答
真難過

fetch是異步的,無論是放到componentWillMount還是componentDidMount中都是沒有差別的,react在結果返回之前就完成組件渲染了。
因此在render方法里面打印一下this.state.setxzvalue的值,可以發(fā)現(xiàn)第一次為空字符串,第二次為實際的setxzvalue值。而defaultValue在第一次已經被賦值了,即使后面?zhèn)魅肓苏_的值,也絕不動搖,這是default家族生而俱來的優(yōu)秀品質,值得尊敬。

解決方案就是未傳入正確的setxzvalue值之前不渲染組件,把defaultValue的第一次留給正確的值

2018年1月3日 23:06
編輯回答
安于心

initialValuedefaultValue 一樣,只有首次生效。你可以在獲取到數(shù)據后用
this.props.form.setFieldValue設置對應的值, 或者從一開始就設置 valuethis.state. setxzvalue

2017年11月2日 17:00