在TouchableOpacity上反应Native nextFocusRight Prop不起作用

Question

我试图使用nextFocusRight停止从React Native中的最后一个元素传播焦点，但是焦点仍传播到下一个视图。根据此拉取请求，它应该可以工作，但仍然面临相同的问题

我的代码：App.js

export default class App extends Component {

  render() {
    const data = [];
    for (let i = 0; i < 10; i++)
      data.push(i);

    return (
      <View>
        <View>
          {[1, 2].map(() => (
            <ScrollView horizontal style={{ height: 210 }}>
              {data.map(i => <Item id={i} buttonRef={this.buttonRef} />)}
            </ScrollView>
          ))}

        </View>
      </View>
    );
  }
}

Item.js

export default class Item extends Component {
    myRef = null;

    componentDidMount() {
        const { id } = this.props;
        if (id == 0) {
            this.myRef.setNativeProps({ nextFocusLeft: findNodeHandle(this.myRef) })
        } else if (id == 9) {
            this.myRef.setNativeProps({ nextFocusRight: findNodeHandle(this.myRef) })
        }
    }

    render() {
        const { id } = this.props;
        return (
            <TouchableOpacity
                key={id}
                ref={(c) => this.myRef = c}
            >
                <View
                    style={{
                        backgroundColor: 'grey',
                        width: 100,
                        height: 100,
                    }}
                >
                    <Text style={{ fontSize: 60 }}>{id}</Text>
                </View>
            </TouchableOpacity>
        )
    }

}

怎么了 有人知道吗

Answer 1

昨天 React-Native 发布了 0.60.0 修复了这个错误。更新日志中没有提及，但他们已在 0.60.0 中修复了它。

对于使用 0.59.9 或更低版本的用户，请将您的项目升级到 0.60.0。