Reactjs React Hooks-当我在另一个选择上选择一个选项时,更改选择选项
我是React的新手,当我从另一个select中选择一个选项时,我想更改select的select选项 我有以下代码: 组成部分:Reactjs React Hooks-当我在另一个选择上选择一个选项时,更改选择选项,reactjs,react-redux,react-hooks,Reactjs,React Redux,React Hooks,我是React的新手,当我从另一个select中选择一个选项时,我想更改select的select选项 我有以下代码: 组成部分: import React from 'react'; import {useDispatcher, useSelector} from 'react-redux'; import {getCounty, getLocality } from '../redux/actions/getData'; import NativeSelect from '@mate
import React from 'react';
import {useDispatcher, useSelector} from 'react-redux';
import {getCounty, getLocality } from '../redux/actions/getData';
import NativeSelect from '@material-ui/core/NativeSelect';
export default function UserDetails() {
const dispatch = useDispatch();
const state = useSelector(state=>state);
const [county, setCounty ] = React.useState("");
const [locality, setLocality ] = React.useState("");
React.useEffect(() => {
dispatch(getCounty());
}, []);
return (
<>
#Select 1
<NativeSelect
value={county}
onChange={e => setCounty(e.targe.value))}
>
<option><option>
{state.county.map(el, key) => (
<option value={el.id} key={key}> {el.name}</option>
))}
</NativeSelect>
#Select 2
<NativeSelect
value={locality}
onChange={e=>setLocality(e.target.value)}
>
<option><option>
{state.locality.map(el, key) => (
<option value={el.id} key={key}> {el.name}</option>
))}
</NativeSelect>
</>
)
}
我必须做什么才能使Select 2基于Select 1进行更新???
谁能举个例子?
对不起,我的英语不好您可以在呈现第二个
之前选择
const countyIds = state.county.map(x => x.id)
//assuming that i.county exists, I don't know how it's called
const filteredLocality = state.locality.filter(i => countyIds.includes(i.county))
return(
{filteredLocality.map(el, key) => (
<option value={el.id} key={key}> {el.name}</option>
))}
)
const countyIds=state.county.map(x=>x.id)
//假设i.county存在,我不知道它叫什么
const filteredLocality=state.locality.filter(i=>countyIds.includes(i.county))
返回(
{filteredLocality.map(el,键)=>(
{el.name}
))}
)
在GetLocation的redux操作中,我获取所有数据,然后根据城市id进行过滤?您实际上不需要过滤数据。只需选择将在中显示的内容
。你可以在运行时这样做,但是如果我在表中有50个地方,性能不是很慢吗?如果你处理大量的数据,请考虑记忆值。代码>使用备忘录
const countyIds = state.county.map(x => x.id)
//assuming that i.county exists, I don't know how it's called
const filteredLocality = state.locality.filter(i => countyIds.includes(i.county))
return(
{filteredLocality.map(el, key) => (
<option value={el.id} key={key}> {el.name}</option>
))}
)