如何从 PlacesAutocomplete 中选择位置的值并将其存储在 TextFormField

Question

我想使用 PlacesAutocomplete 获取地点并将其存储在我的 TextFormField 中。
我从TextFormFeild() 打电话给displayPrediction()

TextFormField(
                    decoration: textInputDecoration.copyWith(hintText: 'From'),
                    onTap: () async {
                      Prediction p = await PlacesAutocomplete.show( 
                        context: context,
                        apiKey: kGoogleApiKey,
                        mode: Mode.overlay,
                        //language: "en",
                        //components: [Component (Component.country, "en")],
                        );
                      displayPrediction(p);
                    },
                  ),

这里是displayPrediction()：

Future<Null> displayPrediction(Prediction p) async {
    if (p != null) {
      PlacesDetailsResponse detail =
      await _places.getDetailsByPlaceId(p.placeId);

      var placeId = p.placeId;
      double lat = detail.result.geometry.location.lat;
      double lng = detail.result.geometry.location.lng;

      var address = await Geocoder.local.findAddressesFromQuery(p.description);

      print(lat);
      print(lng);
      print(address);
    }
  }

变量 kGoogleApiKey 和 _places

const kGoogleApiKey = "My_API_Key";

GoogleMapsPlaces _places = GoogleMapsPlaces(apiKey: kGoogleApiKey);

我想在点击我的 TextFormField 后获取该位置并在同一个 TextFormField 中显示相同的位置

我在选择地点后收到此错误-_TypeError (type 'List<dynamic>' is not a subtype of type 'PlaceDetails')

Answer 1

这里是演示

final TextEditingController _controller = TextEditingController();

TextFormField(      controller: _controller ,
                    decoration: textInputDecoration.copyWith(hintText: 'From'),
                    onTap: () async {
                      Prediction p = await PlacesAutocomplete.show( 
                        context: context,
                        apiKey: kGoogleApiKey,
                        mode: Mode.overlay,
                        //language: "en",
                        //components: [Component (Component.country, "en")],
                        );
                      displayPrediction(p);
                    },
                  ),

看起来您正在使用地理编码器库

Future<Null> displayPrediction(Prediction p) async {
    if (p != null) {
      PlacesDetailsResponse detail =
      await _places.getDetailsByPlaceId(p.placeId);

      var placeId = p.placeId;
      double lat = detail.result.geometry.location.lat;
      double lng = detail.result.geometry.location.lng;

      var address = await Geocoder.local.findAddressesFromQuery(p.description);
      setState(() {
         _controller.text = address.first.featureName;
      });

      print(lat);
      print(lng);
      print(address);
    }
  }

希望对你有帮助