Question

下面的js代码远程执行一系列字段的加载，然后将它们显示在地图上，问题是它调用它不等待等待，我继续所以数据没有显示在地图上由组件重定向，我该怎么做才能让 chaima 在继续渲染地图之前等待函数的响应

import {getmarcaturegiornaliere} from "module.js";

MyComponent.js

  class Am4chartMap extends Component {

    async componentDidMount() {
      let map = am4core.create("map", am4maps.MapChart);
    //Load values from response this function->
    var marcature=await getmarcaturegiornaliere();       
    
    map.geodata = am4geodata_usaHigh;
    map.percentHeight = 90;
    map.dy = 10;
    let polygonSeries = map.series.push(new am4maps.MapPolygonSeries());
    polygonSeries.useGeodata = true;
    map.homeZoomLevel = 1.2;
    map.zoomControl = new am4maps.ZoomControl();
    map.zoomControl.layout = 'horizontal';
    map.zoomControl.align = 'left';
    map.zoomControl.valign = 'bottom';
    map.zoomControl.dy = -10;
    map.zoomControl.contentHeight = 20;
    map.zoomControl.minusButton.background.fill = am4core.color("#C7D0FF");
    map.zoomControl.minusButton.background.stroke = am4core.color("#6979C9");
    map.zoomControl.minusButton.label.fontWeight = 600;
    map.zoomControl.minusButton.label.fontSize = 22;
    map.zoomControl.minusButton.scale = .75;
    map.zoomControl.minusButton.label.scale = .75;
    map.zoomControl.plusButton.background.fill = am4core.color("#C7D0FF");
    map.zoomControl.plusButton.background.stroke = am4core.color("#6979C9");
    map.zoomControl.plusButton.label.fontWeight = 600;
    map.zoomControl.plusButton.label.fontSize = 22;
    map.zoomControl.plusButton.label.align = "center";
    map.zoomControl.plusButton.scale = .75;
    map.zoomControl.plusButton.label.scale = .75;
    map.zoomControl.plusButton.dx = 5;
    let plusButtonHoverState = map.zoomControl.plusButton.background.states.create("hover");
    plusButtonHoverState.properties.fill = am4core.color("#354D84");
    let minusButtonHoverState = map.zoomControl.minusButton.background.states.create("hover");
    minusButtonHoverState.properties.fill = am4core.color("#354D84");
    let polygonTemplate = polygonSeries.mapPolygons.template;
    polygonTemplate.tooltipText = "{name}";
    polygonTemplate.fill = am4core.color("#474D84");
    polygonTemplate.stroke = am4core.color("#6979C9")
    let hs = polygonTemplate.states.create("hover");
    hs.properties.fill = am4core.color("#354D84");
    let citySeries = map.series.push(new am4maps.MapImageSeries());
    citySeries.data = marcature;
    citySeries.dataFields.value = "size";
    let city = citySeries.mapImages.template;
    city.nonScaling = true;
    city.propertyFields.latitude = "latitude";
    city.propertyFields.longitude = "longitude";
    let circle = city.createChild(am4core.Circle);
    circle.fill = am4core.color("#C7D0FF");
    circle.strokeWidth = 0;
    let circleHoverState = circle.states.create("hover");
    circleHoverState.properties.strokeWidth = 1;
    circle.tooltipText = '{tooltip}';
    circle.propertyFields.radius = 'size';

    this.map = map;    
  }

  componentWillUnmount() {
    if(this.map) {
      this.map.dispose();
    }
  }

  render() {,.

module.js

//Setup server
import server from "./settings";
//Rest call axios module
const axios = require('axios').default;

export function getmarcaturegiornaliere() {

    var date="03-02-2021";
    console.log("Data: "+date);
    var listmarcature=[];

    axios.post(server.url+'/Utente/CaricamentoStoricoGiornonaliero', {
        Data: date,
        IdUtente: '3',
        CalcoloOreGiornaliere: true
      })
      .then(function (response) {
        console.log("Response: "+response.data);
        //Vado ad iterare la response
        let data = response.data;
        for (let index in data){
          console.log("Stato: "+data[index].Longitudine);
          var datatemp={
            "latitude" : data[index].Latitudine,
            "longitude" : data[index].Longitudine,
            "size" : 5,
           "tooltip" : data[index].Stato,
          };
          listmarcature.push(datatemp);
        }
       
        }).catch(function (error) {
          console.log("Errore: "+error);
      });

      return listmarcature;
   

}

Answer 1

您的函数 for i in range(df.shape[0]): for word in df.loc[i]['clean_text']: if word in corpus: df['result'] = "Irrelevant" #break else: #continue df['result'] = "Relevant" 不是异步的，这就是问题所在。它总是会返回一个空数组 getmarcaturegiornaliere，因为 [] 在 return listmarcature; 之前执行。因此，您返回一个空数组，并且在将来的某个地方 .then() 会发生（并且它不会执行任何操作，因为您已经返回）。

解决方案是：使其异步。

有一些可用的语法，我会为您提供最适合这种情况的语法：

将 .then() 放在函数中：async
在 export async function getmarcaturegiornaliere() { 调用前添加 await：axios

异步等待渲染组件反应

1 个答案: