使用 tcomb-form-native 时使用 onFocus 回调访问 ref

Question

我正在使用 https://github.com/gcanti/tcomb-form-native & 这是代码片段

_renderScene(route, navigator) {
        var Cook_time = {
        onFocus: () => {
            console.log('cook time has focus');
            console.log(this.refs);
        },
    };

    options.fields['Cook_time'] = Cook_time;


    return (
        <View style={{ flex: 1 }}>
            <ScrollView style={styles.container} ref="scrollView">

                <Form
                    ref="form"
                    type={Recipe}
                    options={options}
                    onChange={this.onChange}
                    onFocus={this.onChange}
                    />

console.log 在应该引用 scrollView 时打印 object{} ，不确定我可能遗漏了什么。这是设置表单本身的代码

var Recipe = t.struct({
 Recipe_name: t.String,
 yield: t.maybe(t.String),
 Prep_time: t.maybe(t.String),
 Cook_time: t.maybe(t.String),
 source: t.maybe(t.String),
})

var options = {
 fields: {
    yield: {
        label: 'Yield',
    },
    Prep_time: {
        label: 'Preparation time',
    },

    source: {
        label: 'Source',
        placeholder: 'family, friends, website ...',
        onFocus: function () {
            console.log('source has focus');
        }
    }
 }

};

Answer 1

ref 属性是一个回调，根据 react-native documentation 我需要做的就是按原样保存参考

    <ScrollView style={styles.container} ref={(ref) => this.myScrollView = ref}>

使用 tcomb-form-native 时使用 onFocus 回调访问 ref

Accessing ref with the onFocus callback while using tcomb-form-native

ref

react-native

tcomb