我是新手,我希望當我通過一個省時,它將返回它的城市。我嘗試NPM,但我不能。我感謝您的幫助。謝謝 !如何在通過省份的時候獲得城市
-4
A
回答
0
我想的東西一般會是這樣的例子在下面的鏈接: https://codesandbox.io/s/zk3m3n4zzx
我基本上使用狀態來存儲所選擇的地址。
const data = {
provinces: [
{ id: 1, name: 'P1' },
{ id: 2, name: 'P2' },
{ id: 3, name: 'P3' },
{ id: 4, name: 'P4' },
],
cities: [
{ id: 1, name: 'C1', provinceId: 1 },
{ id: 2, name: 'C2', provinceId: 1 },
{ id: 3, name: 'C3', provinceId: 1 },
{ id: 4, name: 'C4', provinceId: 2 },
{ id: 5, name: 'C5', provinceId: 2 },
{ id: 6, name: 'C6', provinceId: 3 },
{ id: 7, name: 'C7', provinceId: 4 },
]
};
class Province extends React.Component {
onSelect = (event) => {
this.props.onSelect(parseInt(event.target.value));
}
render() {
return (
<div>
<span>Province: </span>
<select onChange={this.onSelect} >
<option>Select province</option>
{
this.props.data.map(prov => (
<option
key={prov.id}
value={prov.id}
selected={this.props.selectedId === prov.id}>
{prov.name}
</option>
))
}
</select>
</div>
);
}
}
class City extends React.Component {
onSelect = (event) => {
this.props.onSelect(parseInt(event.target.value));
}
render() {
return (
<div>
<span>City: </span>
<select onClick={this.onSelect}>
<option>Select city</option>
{
this.props.data.map(city => (
<option
key={city.id}
value={city.id}
selected={this.props.selectedId === city.id}>
{city.name}
</option>
))
}
</select>
</div>
);
}
}
class Address extends React.Component {
constructor(props) {
super(props);
this.state = {
provinces: data.provinces,
provinceId: null,
cities: data.cities,
cityId: null
};
}
onSelectProvince = (provId) => {
const selCities = data.cities.filter(c => c.provinceId === provId);
this.setState({
provinceId: provId,
cities: selCities
});
}
onSelectCity = (city) => {
this.setState({
cityId: city.id
});
}
render() {
return (
<div>
<Province
data={this.state.provinces}
selectedId={this.state.provinceId}
onSelect={this.onSelectProvince} />
<City
data={this.state.cities}
selectedId={this.state.cityId}
onSelect={this.onSelectCity} />
</div>
);
}
}
+0
謝謝兄弟!我會嘗試這個很酷的 –
+0
......這是否適合你? –
+0
是的,我只是做另一個城市和省份的文件然後打電話給他們。多謝兄弟 ! –
相關問題
- 1. 如何通過通過城市和國家獲得時區?
- 2. 在給定城市的其他城市獲得時間
- 3. 城市/省份/縣與coords名單?
- 4. 通過城市
- 5. 如何通過SPARQL名稱獲得城市人口
- 6. 如何通過Facebook的城市ID查找城市名稱?
- 7. 獲取正確的數據 - 城市和省份數
- 8. 如何根據當前用戶的位置獲取城市和省份
- 9. 如何獲得某些城市
- 10. 可能通過Foursquare獲得我附近的城市嗎?
- 11. 通過sparql獲取城市信息
- 12. 如何在python中獲取城市(geonameid)的附近城市?
- 13. 如何獲得城市飛艇的推送通知?
- 14. 如何獲得推送通知(城市飛艇)的文本
- 15. 城市屬於通過縣到省的關聯,如何簡化代碼?
- 16. Django GeoIP通過城市名稱獲得國家
- 17. 如何獲得某個城市的時間?
- 18. 如何通過vk API獲取城市的所有羣組?
- 19. 如何從特定的城市獲取附近的城市?
- 20. 通過道路獲取直接連接城市的城市列表
- 21. Zend框架中的國家,省份,城市,產品路由
- 22. Magento根據省份/地區劃分的城市列表
- 23. 如何獲取OSM節點或城市的城市和國家?
- 24. 如何避免在兩個城市共享郵遞區號時獲得不同城市的回報價值
- 25. 如何通過谷歌API獲取城市結果?
- 26. 國家省份城市表 - ID或名字
- 27. 獲得Magento城市的終身銷售
- 28. 如何通過scope_identity()獲得身份值
- 29. 如何在Google Maps API中按城市獲得GPOINT Javascript
- 30. 得到城市的Android
這個問題不僅太廣泛,因爲它可以回答很多方面,它也不清楚你問什麼,質量很低。請參觀遊覽或看看幫助中心!謝謝。 – Clijsters
@Clijsters,我的意思是,我有一個下拉菜單,可以選擇省份的哪個地方,然後當我選擇一個省份時,我希望這些城市會顯示我選擇的省份,並且也會放在下拉菜單中。 –
哪省?哪裏?什麼?來自國家?如果是,哪個contry?你的省份數據集來自哪裏?哪種下拉菜單? '