使用 reactstrap 输入模块的 React ref 没有 Value 道具答案

【问题标题】：React ref using reactstrap Input Module doesn't have Value prop使用 reactstrap 输入模块的 React ref 没有 Value 道具
【发布时间】：2019-08-05 22:41:17
【问题描述】：

我有一个带有以下输入元素的反应组件：

import React, {
    Component
} from 'react';
import {Input } from 'reactstrap';     
constructor(props) {
    super(props)   
    this.test = React.createRef();       
}

render() {
    console.log(this.test.current)
    return (
         <Input ref={this.test} defaultValue = "This is the default" />
    )
}

我想从 ref {this.test} 中获取值 Prop 但是，当我控制台日志时，我收到以下输出。

Input {props: {…}, context: {…}, refs: {…}, updater: {…}, getRef: ƒ, …}
context: {}
focus: ƒ ()
getRef: ƒ ()
props: {defaultValue: "This is the default", onChange: ƒ, type: "text"}
refs: {}
state: null
updater: {isMounted: ƒ, enqueueSetState: ƒ, enqueueReplaceState: ƒ, enqueueForceUpdate: ƒ}
_reactInternalFiber: FiberNode {tag: 1, key: null, elementType: ƒ, type: ƒ, stateNode: Input, …}
_reactInternalInstance: {_processChildContext: ƒ}
isMounted: (...)
replaceState: (...)
__proto__: Component

我如何使用 reactstrap “Input” 标签而不是内置的 HTML “input” Dom 元素获取 value prop。

【问题讨论】：

标签： javascript reactjs reactstrap

【解决方案1】：

在 Input 组件中使用 innerRef 而不是 ref。

https://reactstrap.github.io/components/form/

【讨论】：

感谢这项工作。将我的代码更改为：