初始化包含axios调用创建问题的Helper类字段吗?

时间:2019-05-07 13:18:01

标签: reactjs

我有两个类,一个是Component类ProductDetails,另一个是普通类,称为ProductClassificationModel。在ProductClassificationModel中,我想通过在ProductDetails中创建类型为ProductClassificationModel的状态属性来在ProductDetails中使用某些字段和函数。问题是,当我尝试从ProductDetails的componentDidMount函数调用ProductClassificationModel的构造函数时,它没有正确初始化ProductClassificationModel对象。我怀疑问题是因为ProductClassificationModel的构造函数包含异步运行的axios调用。

我在下面附上我的代码,请为此提供一些答案

我尝试将调用链接起来以初始化构造函数中的字段,但是它对我不起作用。

class ProductDetails extends Component
{
   constructor(props)
{
    super(props)
    this.productClassificationModel = new ProductClassificationModel();
    this.state = {
        product : null,
        productClassificationModel : null
    }
 }

 componentDidMount(){
    const {params} = this.props.match
     getProduct(params.productId)
     .then((productObj)=>{
        this.setState({
            product : productObj,
            productClassificationModel : new 
            ProductClassificationModel(productObj.classifications)
        })
     })
     .catch(error =>{
         console.log(error)
     });      
}
}



export default class ProductClassificationModel
{
selectedProductClassifications = [];
productClassifications = [];
productClassificationOptions = [];

constructor(classifications){ 
    getAllProductClassification()
    .then((productClassifications) => {
        this.productClassifications = productClassifications;
        this.productClassificationOptions = createOptionsForClassificationDropdown(productClassifications);
        this.selectedProductClassifications = classifications;
    }) 
}
}

我希望在对componentDidMount的调用完成后,ProductDetails应该正确初始化两个字段

0 个答案:

没有答案