Блог

У меня есть компонент, в котором реквизит объявлен как интерфейс, и этот компонент принимает тип, соответствующий этому интерфейсу.

Например ->

 import React, { Component } from 'react'
import { Text, View } from 'react-native'


 interface IDummy{
    name:string;
    age:number;
}
export default class Dummy extends Component<IDummy,any> {
    constructor(props:IDummy){
        super(props)
        console.log('CHeck the props here ',props)
    }
    render() {
        return (
            <View>
                <Text> Just Text </Text>
            </View>
        )
    }
}
  

Теперь, если я использую этот компонент как часть других компонентов, таких как

 <Text>Something</Text>
<Dummy/>
  

Имя реквизита и возраст работают нормально.
Но когда я хочу перейти к этому компоненту,

 navigation.navigate('Dummy')
  

реквизит, упомянутый в интерфейсе, недоступен.
Есть ли какой-либо способ, которым я мог бы получить к ним доступ???

Я предположу, что вы используете react-navigation

чтобы отправить параметры, вы должны перейти, используя следующую строку:

 navigation.navigate('Dummy', {
  name: 'name',
  age: 'age',
});
  

после отправки события навигации вы можете прочитать значения типа:

 import React, { Component } from 'react'
import { Text, View } from 'react-native'


interface IDummy{
  name: string;
  age: number;
  route: any;
}

export default class Dummy extends Component<IDummy,any> {

    constructor(props: IDummy){
        super(props)
        console.log('properties from navigation ', props.route.params);
        console.log('Check the props here ',props)
    }

    render() {
        return (
            <View>
                <Text> Just Text </Text>
            </View>
        )
    }
}
  

Подробнее об этом: Передача параметров маршрутам