react-native - 如何在 React Native 中以编程方式更新可访问性标签？

Question

我是 React Native 和跨平台编程的新手，所以请多多包涵。我将尝试尽可能合乎逻辑地阐述这一点。

我正在尝试做的事情：我有一个名为 TextDisplay 的自定义组件，它看起来像这样

const TextDisplay = React.forwardRef((props, ref) => {
    return (
        <View 
        style={props.style}>
            <Text
            style={styles.textStyle}
            ref={ref}
            accessibilityLabel={props.label}>
                {props.children}
            </Text>
        </View>
    );
});

基本上我在这个组件中显示了一个字母Text，我需要始终关注可访问性。用户输入一个字母，然后输入的字母将显示在TextDisplay组件中。执行此操作的代码如下所示：

import React, { useState } from 'react';
import { View, StyleSheet, AccessibilityInfo, findNodeHandle, TextInput } from 'react-native';
import TextDisplay from './TextDisplay';

const PortraitKeyboard = props => {

 const textDisplay = React.createRef();
 const [value, setValue] = useState('');

 const handleKeyPressDelay = (keyPress) => {
        let inputLength = keyPress.nativeEvent.key.length;

        if (inputLength == 1) {
            const letter = keyPress.nativeEvent.key.replace(/[^a-zA-Z]/g, '').toLowerCase();
            setValue(letter);
            textDisplay.current.focus();
            const reactTag = findNodeHandle(textDisplay.current);
            AccessibilityInfo.setAccessibilityFocus(reactTag);
        }
 };

 return (

            <TextDisplay
                style={styles.textInput}
                ref={textDisplay}
                label={value}>
                {value}
            </TextDisplay>

            <TextInput
                onKeyPress={handleKeyPressDelay}
            />
 );

};

这就像我希望它在 Android 设备上一样。

问题： 让我先说这个问题只存在于 iOS 设备上。当TextDisplay组件中新输入的字母发生更改时，它不会立即（有时永远不会）更改TextDisplay组件的可访问性标签。例如，TextDisplay组件是空的，我输入字母“a”，效果很好，但是当我输入“b”代替之前输入的“a”时，它会继续说“a”，而不是用 VoiceOver 说“b” . 如果我向上滑动到同一个组件，它只会不断地说出错误的字母。只有当我将焦点切换到另一个组件并返回时，它才会说出正确的字母，或者如果我双击该组件，它也是正确的。出于此应用程序的目的，我需要在不与用户进行任何额外交互的情况下说出所显示的字母。

我试过的： 我试过用谷歌搜索这个问题以及如何刷新可访问性标签，但这是一个非常具体的问题，它涉及可访问性，我什么也没找到。我曾尝试使用Direct Manipulation手动更改可访问性标签，但 VoiceOver 似乎无法重复该字母。我还尝试将可访问性焦点从一个组件移动到下一个组件，但结果是 A：慢（由于某种原因，可访问性焦点移动大约需要 2 秒，我需要做两次。）和 B ：它会说我交换的任何组件，然后说我想要的。

我所需要的只是一种在我更改内部字母时强制 iOS 刷新组件的可访问性标签的方法。有什么方法可以伪造触摸以便我可以选择该项目？还是有一些我没有看到的更简单的解决方案？

标签： react-nativeaccessibilityreact-native-iosvoiceover