反应本地更新选择器值除与ref上的部件

Question

我是新来的反应，和/原生的，我正在打破我的头这个问题。我使用了一个名为反应，原生影像选择器形式是如此好的图书馆，它让我们用你的手机摄像头，也可以选择从您的相册图片。

让我告诉你的代码

import React, {Component} from 'react'
import {Text, View, TouchableOpacity, Picker} from 'react-native'
import t from 'tcomb-form-native'
import ImageFactory from 'react-native-image-picker-form';

const Form = t.form.Form;
const DocumentFormStruct = t.struct({
  image: t.String
});

export default class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
        form: null,
      value: null,
        language: 'PERMISO ESPECIAL',
      options: {
        fields: {
          image: {
            config: {
              title: 'Select image',
              options: ['Open camera', 'Select from gallery', 'Cancel'],
              // Used on Android to style BottomSheet
              style: {
                titleFontFamily: 'Roboto'
              }
            },
            error: 'No image provided',
            factory: ImageFactory
          }
        }
      },
        changed: false
    };
  }

  onPress = () =>{
      if (this.form == undefined){
        console.log("UNDEFINED");
      }else {
          console.log(this.form.getValue());
      }
  }

  componentDidMount() {
      // var value = this.form.getValue();
      // console.log(value);
  }

  shouldComponentUpdate(nextProps, nextState) {
      return false;
  }

    render() {
    return (
        <View>
            <Form
                ref={(ref: any) => {
                    this.form = ref
                }}
                type={DocumentFormStruct}
                value={this.state.value}
                options={this.state.options}
            />

            <Picker
                selectedValue={this.state.language}
                onValueChange={(itemValue, itemIndex) => this.setState({language: itemValue})}>
                <Picker.Item label="PERMISO ESPECIAL"
                             value="PERMISO ESPECIAL"/>
                <Picker.Item label="PERMISO HOJA CLARO" value="HOJA CLARO"/>
                <Picker.Item label="COORDINAR CON PROPIETARIO"
                             value="COORDINA CON PROPIETARIO"/>
            </Picker>

            {this.state.language == 'HOJA CLARO'
                ?
                <View>
                    <Text>Hello World!</Text>
                </View>
                :
                null
            }

            <TouchableOpacity
                onPress={this.onPress}
            >
                <Text> Touch Here </Text>
            </TouchableOpacity>
        </View>
    )
  }
}

我知道，与shouldcomponentupdate，可以防止不必要的重新渲染。问题是，这个库必须使用这个裁判属性为：当在任何其它值的状态变化所选择的图片得到了空。是否有此问题的方法或解决方法。如果我使用shouldcomponentupdate然后采摘价值不会改变，但至少我得到的影像选择器的当前值。

Answer 1

一个解决办法是采取表格的onChange道具的优势。 （See docs）

<Form
    ref={(ref: any) => {
      this.form = ref
    }}
    type={DocumentFormStruct}
    value={this.state.value}
    options={this.state.options}
    onChange={this.onChange}
/>

在你的onChange方法，保存在本地状态值。

onChange = (value) => {
    this.setState({value});
}

现在，即使如你所说它重新初始化，它会得到当地状态的值，也不会成为空。