滚动到反应本机滚动视图动态子级

Question

我创建了一个呈现动态表单元素的滚动视图。我可以为滚动视图的每个动态子项创建"ref"。但是我面临的问题是我想滚动到表单中存在验证错误的确切子项。但是我找不到每个子项相对于滚动视图的实际位置，以便我可以滚动到该元素。

我尝试将 onLayout 方法添加到子组件中，但它在加载时只返回一次位置，然后值保持不变，即使在滚动后也是如此。

我的滚动视图

<ScrollView style={{marginBottom: 55}} ref={(ref) => { this.formScrollList = ref; }}>
{this.state.formElements.map((element, i) => {
return (
<TextboxInput quesNo={element.key + 1} required={element.required} error={this.state.errors[element.question_id]} quesType={element.type} quesId={element.question_id} placeholder={element.placeholder} onChangeHandler={this.onChangeHandler} label={element.label} defaultValue={this.state.answers[element.question_id]} showRequired={this.showRequired} index={element.index}/>
)
})}
</ScrollView>

我的文本框输入子项

const TextboxInput = (props) => (
<View style={styles.inputContainer} ref={setRef}>
<Text style={styles.text}>{props.label || "Textbox"}{props.showRequired(props.required)}</Text>
<TextInput style={[styles.textInput, props.error === "empty" ? {borderWidth: 1, borderColor: "red"} : null]} {...props} onChangeText={props.onChangeHandler.bind(this, props.quesId, props.quesType, props.index)} placeholder={props.placeholder} underlineColorAndroid="transparent" defaultValue={props.defaultValue}/>
</View>
)

我想滚动到表单中存在验证错误的确切子项。

Answer 1

使用scrollview组件的scrollTo方法。