我如何访问 React Native 中组件的内部属性（标题）

Question

我想访问 return 之外的标题属性以便我可以将它传递给其他人，但我不知道如何访问组件的属性这是我的自定义组件

import React, {Component} from 'react';
import { View, Text, StyleSheet } from 'react-native';
export const ClickableIcon = (props) => {
    console.warn('hi')
    return (
        <TouchableOpacity onPress={props.onPress} >
            <Text>{props.title}</Text>
        </TouchableOpacity>
    )
}

我在这里使用那个组件

import React from 'react';
import { View, Text, StyleSheet, } from 'react-native';
const Divisions = (props) => {
console.warn(title) **I want to access particular title of key 1** 
  return (
    <View style={styles.block}>

      <ClickableIcon  onPress={props.onPress} title='ac service' key='1'
       />
      <ClickableIcon onPress={props.onPress}  title='babysitter' key='2' 
       />

    </View>
  )
}
export default Divisions;

Answer 1

您想访问他父亲中 child 组件的 title 属性，而您声明 title 的值的第一时间是在 [=31= 的渲染中].

所以你有两个选择，

首先是用ref访问父亲处的child的属性。这种方法的好处是你仍然可以只在渲染时声明标题，缺点是它复杂、反模式，React 文档建议反对

How to call child component function from Parent in react

第二个选项是在渲染之前声明titles，并为这个数组渲染一个贴图

   const Divisions = (props) => {
      const titles = [ { t: 'ac service', k: 1 }, { t: 'babysitter', k: '2' } ]
      return (
        <View style={styles.block}>
         { titels.map(title => 
            <ClickableIcon onPress={props.onPress} title={title.t} key={title.k} />
          )
         }
        </View>
        )
       }

现在 titels 存在于 parent

我如何访问 React Native 中组件的内部属性（标题）

how can i access the inside property (title) of an component in react native

javascript

reactjs

native

我如何访问 React Native 中组件的内部 属性（标题）

how can i access the inside property (title) of an component in react native

javascript

reactjs

native

我如何访问 React Native 中组件的内部属性（标题）