React Native的
因此,我尝试使用React Native和onEndEditing构建表单验证。
所以我的React Native代码看起来是这样的:
<TextInput onSubmitEditing={value => console.log(value)} />
当用户停止编辑时,它应该记录该值。但我得到的不是日志:
{"_dispatchInstances": {"_debugHookTypes": null, "_debugID": 1400, "_debugIsCurrentlyTiming": false,
"_debugNeedsRemount": false, "_debugOwner": {"_debugHookTypes": [Array], "_debugID": 1394,
"_debugIsCurrentlyTiming": false, "_debugNeedsRemount": false, "_debugOwner": [FiberNode], "_debugSource":
[Object], "actualDuration": 0, "actualStartTime": 5771, "alternate": [FiberNode], "child": [FiberNode],
"childExpirationTime": 0, "dependencies": null, "effectTag": 517, "elementType": [Function
InternalTextInput], "expirationTime": 0, "firstEffect": [Circular], "index": 0, "key": null, "lastEffect":
[FiberNode], "memoizedProps": [Object], "memoizedState": [Object], "mode": 8, "nextEffect": null,
"pendingProps": [Object], "ref": null, "return": [FiberNode], "selfBaseDuration": 0, "sibling": null,
"stateNode": null, "tag": 0, "treeBaseDuration": 0, "type": [Function InternalTextInput], "updateQueue":
[Object]}, "_debugSource": {"columnNumber": 7, "fileName":
"C:\A_USER\App\The_App\\node_modules\react-native\Libraries\Components\TextInput\TextInput.js",
"lineNumber": 1111}, "actualDuration": 0, "actualStartTime": 5771, "alternate": {"_debugHookTypes": null,
"_debugID": 1400, "_debugIsCurrentlyTiming": false, "_debugNeedsRemount": false, "_debugOwner":
[FiberNode], "_debugSource": [Object], "actualDuration": 0, "actualStartTime": 149374, "alternate":
[Circular], "child": null, "childExpirationTime": 0, "dependencies": null, "effectTag": 132,
"elementType": "AndroidTextInput", "expirationTime": 0, "firstEffect": null, "index": 0, "key": null,
"lastEffect": null, "memoizedProps": [Object], "memoizedState": null, "mode": 8, "nextEffect": null,
"pendingProps": [Object], "ref": [Function forwardRef], "return": [FiberNode], "selfBaseDuration": 0,
"sibling": null, "stateNode": [ReactNativeFiberHostComponent], "tag": 5, "treeBaseDuration": 0, "type":
"AndroidTextInput", "updateQueue": null}, "child": null, "childExpirationTime": 0, "dependencies": null,
"effectTag": 132, "elementType": "AndroidTextInput", "expirationTime": 0, "firstEffect": null, "index": 0,
"key": null, "lastEffect": null, "memoizedProps": {"accessible": true, "allowFontScaling": true,
"autoCapitalize": "sentences", "children": undefined, "disableFullscreenUI": undefined, "focusable": true,
"forwardedRef": null, "mostRecentEventCount": 5, "onBlur": [Function _onBlur], "onChange": [Function
_onChange], "onChangeText": [Function onChangeText], "onClick": [Function onClick], "onEndEditing":
[Function onEndEditing], "onFocus": [Function _onFocus], "onResponderGrant": [Function onResponderGrant],
"onResponderMove": [Function onResponderMove], "onResponderRelease": [Function onResponderRelease],
"onResponderTerminate": [Function onResponderTerminate], "onResponderTerminationRequest": [Function
onResponderTerminationRequest], "onScroll": [Function _onScroll], "onSelectionChange": [Function
_onSelectionChange], "onStartShouldSetResponder": [Function onStartShouldSetResponder],
"rejectResponderTermination": true, "selection": null, "style": [Array], "text": "hallo",
"textBreakStrategy": undefined, "underlineColorAndroid": "transparent", "value": "hallo"},
"memoizedState": null, "mode": 8, "nextEffect": null, "pendingProps": {"accessible": true,
"allowFontScaling": true, "autoCapitalize": "sentences", "children": undefined, "disableFullscreenUI":
undefined, "focusable": true, "forwardedRef": null, "mostRecentEventCount": 5, "onBlur": [Function
_onBlur], "onChange": [Function _onChange], "onChangeText": [Function onChangeText], "onClick": [Function
onClick], "onEndEditing": [Function onEndEditing], "onFocus": [Function _onFocus], "onResponderGrant":
[Function onResponderGrant], "onResponderMove": [Function onResponderMove], "onResponderRelease":
[Function onResponderRelease], "onResponderTerminate": [Function onResponderTerminate],
"onResponderTerminationRequest": [Function onResponderTerminationRequest], "onScroll": [Function
_onScroll], "onSelectionChange": [Function _onSelectionChange], "onStartShouldSetResponder": [Function
onStartShouldSetResponder], "rejectResponderTermination": true, "selection": null, "style": [Array],
"text": "hallo", "textBreakStrategy": undefined, "underlineColorAndroid": "transparent", "value":
"hallo"}, "ref": [Function forwardRef], "return": {"_debugHookTypes": null, "_debugID": 1398,
"_debugIsCurrentlyTiming": false, "_debugNeedsRemount": false, "_debugOwner": [FiberNode], "_debugSource":
[Object], "actualDuration": 0, "actualStartTime": 5771, "alternate": [FiberNode], "child": [Circular],
"childExpirationTime": 0, "dependencies": null, "effectTag": 5, "elementType": [Function
TouchableWithoutFeedback], "expirationTime": 0, "firstEffect": [Circular], "index": 0, "key": null,
"lastEffect": [Circular], "memoizedProps": [Object], "memoizedState": [Object], "mode": 8, "nextEffect":
null, "pendingProps": [Object], "ref": null, "return": [FiberNode], "selfBaseDuration": 0, "sibling":
null, "stateNode": [TouchableWithoutFeedback], "tag": 1, "treeBaseDuration": 0, "type": [Function
TouchableWithoutFeedback], "updateQueue": [Object]}, "selfBaseDuration": 0, "sibling": null, "stateNode":
{"_children": [Array], "_internalFiberInstanceHandleDEV": [Circular], "_nativeTag": 177, "clear":
[Function clear], "getNativeRef": [Function getNativeRef], "isFocused": [Function isFocused],
"viewConfig": [Object]}, "tag": 5, "treeBaseDuration": 0, "type": "AndroidTextInput", "updateQueue":
null}, "_dispatchListeners": [Function onSubmitEditing], "_targetInst": {"_debugHookTypes": null,
"_debugID": 1400, "_debugIsCurrentlyTiming": false, "_debugNeedsRemount": false, "_debugOwner":
{"_debugHookTypes": [Array], "_debugID": 1394, "_debugIsCurrentlyTiming": false, "_debugNeedsRemount":
false, "_debugOwner": [FiberNode], "_debugSource": [Object], "actualDuration": 0, "actualStartTime": 5771,
"alternate": [FiberNode], "child": [FiberNode], "childExpirationTime": 0, "dependencies": null,
"effectTag": 517, "elementType": [Function InternalTextInput], "expirationTime": 0, "firstEffect":
[Circular], "index": 0, "key": null, "lastEffect": [FiberNode], "memoizedProps": [Object],
"memoizedState": [Object], "mode": 8, "nextEffect": null, "pendingProps": [Object], "ref": null, "return":
[FiberNode], "selfBaseDuration": 0, "sibling": null, "stateNode": null, "tag": 0, "treeBaseDuration": 0,
"type": [Function InternalTextInput], "updateQueue": [Object]}, "_debugSource": {"columnNumber": 7,
"fileName": "C:\A_USER\App\The_App\\node_modules\react-
native\Libraries\Components\TextInput\TextInput.js", "lineNumber": 1111}, "actualDuration": 0,
"actualStartTime": 5771, "alternate": {"_debugHookTypes": null, "_debugID": 1400,
"_debugIsCurrentlyTiming": false, "_debugNeedsRemount": false, "_debugOwner": [FiberNode], "_debugSource":
[Object], "actualDuration": 0, "actualStartTime": 149374, "alternate": [Circular], "child": null,
"childExpirationTime": 0, "dependencies": null, "effectTag": 132, "elementType": "AndroidTextInput",
"expirationTime": 0, "firstEffect": null, "index": 0, "key": null, "lastEffect": null, "memoizedProps":
[Object], "memoizedState": null, "mode": 8, "nextEffect": null, "pendingProps": [Object], "ref": [Function
forwardRef], "return": [FiberNode], "selfBaseDuration": 0, "sibling": null, "stateNode":
[ReactNativeFiberHostComponent], "tag": 5, "treeBaseDuration": 0, "type": "AndroidTextInput",
"updateQueue": null}, "child": null, "childExpirationTime": 0, "dependencies": null, "effectTag": 132,
"elementType": "AndroidTextInput", "expirationTime": 0, "firstEffect": null, "index": 0, "key": null,
"lastEffect": null, "memoizedProps": {"accessible": true, "allowFontScaling": true, "autoCapitalize":
"sentences", "children": undefined, "disableFullscreenUI": undefined, "focusable": true, "forwardedRef":
null, "mostRecentEventCount": 5, "onBlur": [Function _onBlur], "onChange": [Function _onChange],
"onChangeText": [Function onChangeText], "onClick": [Function onClick], "onEndEditing": [Function
onEndEditing], "onFocus": [Function _onFocus], "onResponderGrant": [Function onResponderGrant],
"onResponderMove": [Function onResponderMove], "onResponderRelease": [Function onResponderRelease],
"onResponderTerminate": [Function onResponderTerminate], "onResponderTerminationRequest": [Function
onResponderTerminationRequest], "onScroll": [Function _onScroll], "onSelectionChange": [Function
_onSelectionChange], "onStartShouldSetResponder": [Function onStartShouldSetResponder],
"rejectResponderTermination": true, "selection": null, "style": [Array], "text": "hallo",
"textBreakStrategy": undefined, "underlineColorAndroid": "transparent", "value": "hallo"},
"memoizedState": null, "mode": 8, "nextEffect": null, "pendingProps": {"accessible": true,
"allowFontScaling": true, "autoCapitalize": "sentences", "children": undefined, "disableFullscreenUI":
undefined, "focusable": true, "forwardedRef": null, "mostRecentEventCount": 5, "onBlur": [Function
_onBlur], "onChange": [Function _onChange], "onChangeText": [Function onChangeText], "onClick": [Function
onClick], "onEndEditing": [Function onEndEditing], "onFocus": [Function _onFocus], "onResponderGrant":
[Function onResponderGrant], "onResponderMove": [Function onResponderMove], "onResponderRelease":
[Function onResponderRelease], "onResponderTerminate": [Function onResponderTerminate],
"onResponderTerminationRequest": [Function onResponderTerminationRequest], "onScroll": [Function
_onScroll], "onSelectionChange": [Function _onSelectionChange], "onStartShouldSetResponder": [Function
onStartShouldSetResponder], "rejectResponderTermination": true, "selection": null, "style": [Array],
"text": "hallo", "textBreakStrategy": undefined, "underlineColorAndroid": "transparent", "value":
"hallo"}, "ref": [Function forwardRef], "return": {"_debugHookTypes": null, "_debugID": 1398,
"_debugIsCurrentlyTiming": false, "_debugNeedsRemount": false, "_debugOwner": [FiberNode], "_debugSource":
[Object], "actualDuration": 0, "actualStartTime": 5771, "alternate": [FiberNode], "child": [Circular],
"childExpirationTime": 0, "dependencies": null, "effectTag": 5, "elementType": [Function
TouchableWithoutFeedback], "expirationTime": 0, "firstEffect": [Circular], "index": 0, "key": null,
"lastEffect": [Circular], "memoizedProps": [Object], "memoizedState": [Object], "mode": 8, "nextEffect":
null, "pendingProps": [Object], "ref": null, "return": [FiberNode], "selfBaseDuration": 0, "sibling":
null, "stateNode": [TouchableWithoutFeedback], "tag": 1, "treeBaseDuration": 0, "type": [Function
TouchableWithoutFeedback], "updateQueue": [Object]}, "selfBaseDuration": 0, "sibling": null, "stateNode":
{"_children": [Array], "_internalFiberInstanceHandleDEV": [Circular], "_nativeTag": 177, "clear":
[Function clear], "getNativeRef": [Function getNativeRef], "isFocused": [Function isFocused],
"viewConfig": [Object]}, "tag": 5, "treeBaseDuration": 0, "type": "AndroidTextInput", "updateQueue":
null}, "bubbles": undefined, "cancelable": undefined, "currentTarget": {"_children": [],
"_internalFiberInstanceHandleDEV": {"_debugHookTypes": null, "_debugID": 1400, "_debugIsCurrentlyTiming":
false, "_debugNeedsRemount": false, "_debugOwner": [FiberNode], "_debugSource": [Object],
"actualDuration": 0, "actualStartTime": 5771, "alternate": [FiberNode], "child": null,
"childExpirationTime": 0, "dependencies": null, "effectTag": 132, "elementType": "AndroidTextInput",
"expirationTime": 0, "firstEffect": null, "index": 0, "key": null, "lastEffect": null, "memoizedProps":
[Object], "memoizedState": null, "mode": 8, "nextEffect": null, "pendingProps": [Object], "ref": [Function
forwardRef], "return": [FiberNode], "selfBaseDuration": 0, "sibling": null, "stateNode": [Circular],
"tag": 5, "treeBaseDuration": 0, "type": "AndroidTextInput", "updateQueue": null}, "_nativeTag": 177,
"clear": [Function clear], "getNativeRef": [Function getNativeRef], "isFocused": [Function isFocused],
"viewConfig": {"Commands": [Object], "Constants": [Object], "NativeProps": [Object], "bubblingEventTypes":
[Object], "directEventTypes": [Object], "uiViewClassName": "AndroidTextInput", "validAttributes":
[Object]}}, "defaultPrevented": undefined, "dispatchConfig": {"phasedRegistrationNames": {"bubbled":
"onSubmitEditing", "captured": "onSubmitEditingCapture"}}, "eventPhase": undefined, "isDefaultPrevented":
[Function functionThatReturnsFalse], "isPropagationStopped": [Function functionThatReturnsFalse],
"isTrusted": undefined, "nativeEvent": {"target": 177, "text": "hallo"}, "target": {"_children": [],
"_internalFiberInstanceHandleDEV": {"_debugHookTypes": null, "_debugID": 1400, "_debugIsCurrentlyTiming":
false, "_debugNeedsRemount": false, "_debugOwner": [FiberNode], "_debugSource": [Object],
"actualDuration": 0, "actualStartTime": 5771, "alternate": [FiberNode], "child": null,
"childExpirationTime": 0, "dependencies": null, "effectTag": 132, "elementType": "AndroidTextInput",
"expirationTime": 0, "firstEffect": null, "index": 0, "key": null, "lastEffect": null, "memoizedProps":
[Object], "memoizedState": null, "mode": 8, "nextEffect": null, "pendingProps": [Object], "ref": [Function
forwardRef], "return": [FiberNode], "selfBaseDuration": 0, "sibling": null, "stateNode": [Circular],
"tag": 5, "treeBaseDuration": 0, "type": "AndroidTextInput", "updateQueue": null}, "_nativeTag": 177,
"clear": [Function clear], "getNativeRef": [Function getNativeRef], "isFocused": [Function isFocused],
"viewConfig": {"Commands": [Object], "Constants": [Object], "NativeProps": [Object], "bubblingEventTypes":
[Object], "directEventTypes": [Object], "uiViewClassName": "AndroidTextInput", "validAttributes":
[Object]}}, "timeStamp": 1618571323238, "type": undefined}
如果用户不再编辑文本,它可能是什么,或者是否有其他方法只记录值?适用于IOS和Android
onSubmitEditing
返回一个事件,而不是一个普通值。
为了访问输入的值,您必须访问e.nativeEvent.text
。因此,在您的情况下,它将是value.nativeEvent.text
。
请在此处查看所有附加选项:
https://reactnative.dev/docs/textinput#onsubmitediting