如何使用 javascript(Reactjs) 作为前端和 node.js 作为后端创建依赖下拉列表

Question

If i select city A then it explore Areas in that city. After I selecting the area it also explore streets in that area. After that i select street, It will be stored in my Database

Answer 1

Your database should be like this:

Cities

id - name - other fields

Areas

id - name - cityId - other fields

Streets

id - name - areaId - other fields

When you want to save the street (let's say you are saving to restaurants table), then your restaurants table should be like:

Restaurants

id - name - streetId - other fields

Only saving the streetId will be enough for you, because from streetId you can get which city or area the street is in. Don't forget to check if streetId exists before saving the restaurant. So that you can send a meaningful response to the client.

On the first load of your web page, you should only get the city list. Once a city is picked, then you should get the area list. Once an area is picked, you should get the street list. Otherwise, it will be too much data to fetch from the database.