反应原生 TextInput onBlur 在 android 上未定义答案

【问题标题】：react native TextInput onBlur get unedfined at android反应原生 TextInput onBlur 在 android 上未定义
【发布时间】：2017-11-17 09:15:02
【问题描述】：

我的 react-native 版本是 0.38.0

<TextInput onBlur={ (event) =>
   this.handleBlurCheck(event.nativeEvent.text,params) } />

在函数 handleBlurCheck 中，我在 iOS 上得到了值，但在 Android 上得到了 undefined。

TextInput在android平台上模糊时如何获取价值？

iOS 上的nativeEvent 对象：

nativeEvent:{
    eventCount: 5,
    target: 1046,
    text: '56'
}

Android 上的nativeEvent：

nativeEvent:{
    target: 1046,
}

【问题讨论】：

标签： reactjs react-native

【解决方案1】：

试试onEndEditing，比如

<TextInput onEndEditing={ (event) => this.handleBlurCheck(event.nativeEvent.text,params) } />

您可以查看报告的问题here

【讨论】：

【解决方案2】：

我只是使用 onChange 来获取值。

  onChange={(event) => this.setState({
                         value: event.nativeEvent.text
                       })}

并触发模糊功能

【讨论】：

【解决方案3】：

关于参数的文档真的很有限：

https://facebook.github.io/react-native/releases/0.38/docs/textinput.html

虽然作为一个散步可以使用

<TextInput
  onChangeText={(text) => this.setState({text})}
  onEndEditing={() => this.handleBlurCheck(this.state.text, params)}
/>

UPD。

另一个需要考虑的可行解决方案是：

<TextInput
  onEndEditing={(e) => this.handleBlurCheck(e.nativeEvent.text, params)}
/>

详细说明：

查看源代码很明显，您得到的正是发送的内容： ReactTextInputBlurEvent.java

private WritableMap serializeEventData() {
  WritableMap eventData = Arguments.createMap();
  eventData.putInt("target", getViewTag());
  return eventData;
}

与一切就绪的 iOS 代码不同： RCTEventDispatcher.m

NSMutableDictionary *body = [[NSMutableDictionary alloc] initWithDictionary:@{
  @"eventCount": @(eventCount),
  @"target": reactTag
}];

if (text) {
  body[@"text"] = text;
}

if (key) {
  if (key.length == 0) {
    key = @"Backspace"; // backspace
} else {
  switch ([key characterAtIndex:0]) {
    case '\t':
    key = @"Tab";
    break;
    case '\n':
    key = @"Enter";
    default:
    break;
  }
}
body[@"key"] = key;

但是，如果我们查看“onEndEditing”事件： ReactTextInputEndEditingEvent.java

private WritableMap serializeEventData() {
  WritableMap eventData = Arguments.createMap();
  eventData.putInt("target", getViewTag());
  eventData.putString("text", mText);
  return eventData;
}

text 属性设置在那里。

【讨论】：

【解决方案4】：

关于模糊函数有这些参数。

onBlur = (event, newValue, previousValue) =>{ }

在 ios 中更改的值由

给出

新值

参数，但在 android 中由

给出

上一个值

所以你可以使用这个逻辑来获取文本值。

import {isUndefined} from 'lodash';

onBlur = (event, nv, pv) =>{ 
  const value = isUndefined(nv)? pv:nv;
  // use value to as the text field value
}

【讨论】：