Question

我如何用权角向输入值倾角?

我可以听到我想要获得信息的话。

但我如何确定我的投入价值?

在我新的PostPage.jsx案中,我使用了这一守则。

const [selectedAddress,setSelectedAddress] = useState();
const [coordinates, setCoordinates] = useState();

<div className="item">
  <label htmlFor="address">Address</label>
  <GoogleAddressSearch
      selectedAddress={(value)=> setSelectedAddress(value)}
      setCoordinates={(value)=> setCoordinates(value)}
/>
</div>

GoogleAddressSearch.jsx code

<GooglePlacesAutocomplete apiKey=process.env.GoogleApiKey 
    selectProps={{
        placeholder:  Search... ,
        isClearable:true,
        className: w-full ,
        onChange:(place) => {
            console.log(place)
            selectedAddress(place)
            geocodeByAddress(place.label)
            .then(result=>getLatLng(result[0]))
            .then(({lat,lng}) => {
                setCoordinates({lat,lng})
            })
        }
    }}/>
    </div>

And I can get the information

Then, I want to put information to input value, how can I do? I need to put city, lat and lng, also it s disable.

I think the city json field is secondary_text

<div className="item">
  <label htmlFor="city">City</label>
  <input id="city" name="city" type="text" disabled />
</div>
<div className="item">
  <label htmlFor="latitude">Latitude</label>
  <input id="latitude" name="latitude" type="text" disabled />
</div>
<div className="item">
  <label htmlFor="longitude">Longitude</label>
  <input id="longitude" name="longitude" type="text" disabled />
</div>

Answer 1

Modified

const [selectedAddress,setSelectedAddress] = useState();
const [coordinates, setCoordinates] = useState();

to

const [selectedAddress,setSelectedAddress] = useState(  );
const [coordinates, setCoordinates] = useState(  );

添加<代码>const [city, setCity] = useState( )

Then

<input id="city" name="city" type="text" disabled value={city} />
<input id="latitude" name="latitude" type="text" disabled value={coordinates.lat}  />
<input id="latitude" name="latitude" type="text" disabled value={coordinates.lng}  />

function GoogleAddressSearch add setCity

function GoogleAddressSearch({selectedAddress,setCoordinates,setCity})
.
.
.
setCity(place.value.structured_formatting.secondary_text)
..

结论

<div className="item">
  <label htmlFor="address">Address</label>
  <GoogleAddressSearch
      selectedAddress={(value)=> setSelectedAddress(value)}
      setCoordinates={(value)=> setCoordinates(value)}
      setCity={(value)=>setCity(value)}
/>
</div>

友情链接