React从json返回多个变量

我目前正在尝试重构一个react项目。文件越来越大,所以我想把它分成不同的文件。我的原始文件应用程序.js包含此状态:

this.state = {
  selectProduct: [],
  quantityProduct: [],
  colorsProduct: [],
  stockProduct: [],
  turnaroundProduct: [],
  coatingProduct: [],
  attributeProduct: [],
  attributeMetaProduct: [],
}

然后我运行一个函数来执行一个获取请求,并用以下命令更新状态:

pullProductDetails = () => {
  fetch('http://127.0.0.1:8000/product_details/fetch/36')
  .then(response => response.json())
  .then(json => {
    const quantityDetails = json.productQuanties.map((quantityDetail) => {
        quantityDetail.selected = false;
    });
    const colorDetails = json.productColor.map((colorDetail) => {
        colorDetail.selected = false;
    });
    const stockDetails = json.productPaperStock.map((stockDetail) => {
        stockDetail.selected = false;
    });
    const turnaroundDetails = json.productTurnaround.map((turnaroundDetail) => {
        turnaroundDetail.selected = false;
    });

    if (json.productCoating.length > 0) {
      const coatingDetails = json.productCoating.map((coatingDetail) => {
          coatingDetail.selected = false;
      }) }
    if (json.productAttributeMeta.length > 0) {
      const attributeMetaDetails = json.productAttributeMeta.map((attributeMetaDetail) => {
          attributeMetaDetail.selected = false;
      }) }

    this.setState(
      {
        quantityProduct: [...this.state.quantityProduct, ...json.productQuanties],
        colorsProduct: [...this.state.colorsProduct, ...json.productColor],
        stockProduct: [...this.state.stockProduct, ...json.productPaperStock],
        turnaroundProduct: [...this.state.turnaroundProduct, ...json.productTurnaround],
        coatingProduct: [...this.state.turnaroundProduct, ...json.productCoating],
        attributeProduct: [...this.state.attributeProduct, ...json.productAttribute],
        attributeMetaProduct: [...this.state.attributeMetaProduct, ...json.productAttributeMeta],
      },
      () => {console.log(this.state)}
    );
      });
}

瘦身app.js 文件我为上述代码创建了一个新文件,如下所示:

export const pullProductDetails = () => {
  fetch('http://127.0.0.1:8000/product_details/fetch/36')
  .then(response => response.json())
  .then(json => {
    const quantityDetails = json.productQuanties.map((quantityDetail) => {
        quantityDetail.selected = false;
    });
    const colorDetails = json.productColor.map((colorDetail) => {
        colorDetail.selected = false;
    });
    const stockDetails = json.productPaperStock.map((stockDetail) => {
        stockDetail.selected = false;
    });
    const turnaroundDetails = json.productTurnaround.map((turnaroundDetail) => {
        turnaroundDetail.selected = false;
    });

    if (json.productCoating.length > 0) {
      const coatingDetails = json.productCoating.map((coatingDetail) => {
          coatingDetail.selected = false;
      }) }
    if (json.productAttributeMeta.length > 0) {
      const attributeMetaDetails = json.productAttributeMeta.map((attributeMetaDetail) => {
          attributeMetaDetail.selected = false;
      }) }

      return [quantityDetails, colorDetails, stockDetails, turnaroundDetails, coatingDetails, attributeMetaDetails];

      });
}

在上面的代码中,我试图用json数据返回这些变量中的每一个,这样我就可以用它来设置状态,但是在我的控制台中,它说这个变量不存在。我还试着从js文件运行控制台,结果显示未定义:

console.log(quantityDetails);

我希望能够访问变量,因为我返回他们,但我不能这样做。有人能告诉我我做错了什么吗?