Reactjs 如何在react native中将ref从父级传递到子级可触摸不透明度?
我在父转换视图中有一个转换引用,我想在子视图中传递:Reactjs 如何在react native中将ref从父级传递到子级可触摸不透明度?,reactjs,typescript,react-native,Reactjs,Typescript,React Native,我在父转换视图中有一个转换引用,我想在子视图中传递: const transition = ( <Transition.Together> <Transition.In type="fade" durationMs={300} /> <Transition.Change /> <Transition.Out type="fade" durationMs={300} /> <
const transition = (
<Transition.Together>
<Transition.In type="fade" durationMs={300} />
<Transition.Change />
<Transition.Out type="fade" durationMs={300} />
</Transition.Together>
);
const FiltersModal: FC = () => {
const transitionRef = useRef<TransitioningView>(null);
return (
<FiltersContainer ref={transitionRef} transition={transition}>
...
{primaryFilters.map((primaryFilter, i) => (
<FilterOption key={i} ref={transitionRef} label={primaryFilter}>
{primaryFilter}
</FilterOption>
))}
const转换=(
);
常量过滤器模式:FC=()=>{
const transitionRef=useRef(null);
返回(
...
{primaryFilters.map((primaryFilters,i)=>(
{primaryFilter}
))}
这是我的过滤选项,下面是一个答案:
常量过滤器选项:React.ComponentType=React.forwardRef(
({label}:FilterOptionProps,ref?:React.ref)=>{
const[isSelected,setiIsSelected]=useState(false);
const onPress=()=>{
如果(ref.current)ref.current.animateNextTransition();
setiIsSelected((prevIsSelected)=>!prevIsSelected);
};
如果(isSelected)返回null;
返回(
{label}
);
}
);
但我有此警告,无法参考当前参考:
Type 'ForwardRefExoticComponent<Pick<FilterOptionProps, "label"> & RefAttributes<TransitioningView>>' ....
键入“ForwardRefExoticComponent”。。。。
如何在react native+typescript中的touchableOpacity中使用forwardref?这就是我的工作原理:
interface FilterOptionProps {
label: string;
}
const FilterOption: React.ForwardRefExoticComponent<
FilterOptionProps & React.RefAttributes<TransitioningView>
> = React.forwardRef(({ label }, ref) => {
...
if((ref as React.RefObject<TransitioningView>).current)
(ref as React.RefObject<TransitioningView>).current.animateNextTransition()
接口过滤器选项道具{
标签:字符串;
}
常量筛选器选项:React.ForwardRefExoticComponent<
FilterOptionProps&React.RefAttribute
>=React.forwardRef(({label},ref)=>{
...
if((作为React.ReObject.current参考)
(引用为React.reObject).current.animateNextTransition()
将ref作为专业名称发送,并在组件中使用transitionRef.current?.animateNextTransition()
interface FilterOptionProps {
label: string;
}
const FilterOption: React.ForwardRefExoticComponent<
FilterOptionProps & React.RefAttributes<TransitioningView>
> = React.forwardRef(({ label }, ref) => {
...
if((ref as React.RefObject<TransitioningView>).current)
(ref as React.RefObject<TransitioningView>).current.animateNextTransition()