代码之家  ›  专栏  ›  技术社区  ›  user504909

get refs antd组件如何选择antd的值?

  •  0
  • user504909  · 技术社区  · 6 年前

    我使用新的参考方法 https://reactjs.org/docs/refs-and-the-dom.html

    this.myRef = React.createRef();
    

    当它应该像:

    rend(){
                        <Select style={{ width: 200 }} ref={this.myRef}>
                        {Object.entries(this.state.catedict)
                            .map(en => <Option key={en[0]}>{en[1]}</Option>)}
                    </Select>
    }
    

    但当我想得到输入值或选择

    我试着:

    console.log(this.myRef.current.value);
    

    我甚至发现:

    console.log(this.myRef.current);
    

    结果是:

    t {props: {…}, context: {…}, refs: {…}, updater: {…}, saveSelect: ƒ, …}
    context: {}
    props: {style: {…}, children: Array(2), prefixCls: "ant-select", showSearch: false, transitionName: "slide-up", …}
    rcSelect: t {props: {…}, context: {…}, refs: {…}, updater: {…}, onInputChange: ƒ, …}
    refs: {}
    renderSelect: ƒ (n)
    saveSelect: ƒ (n)
    state: null
    updater: {isMounted: ƒ, enqueueSetState: ƒ, enqueueReplaceState: ƒ, enqueueForceUpdate: ƒ}
    _reactInternalFiber: Na {tag: 2, key: null, type: ƒ, stateNode: t, return: Na, …}
    __proto__: v
    

    2 回复  |  直到 6 年前
        1
  •  -1
  •   Hamid Sarani    6 年前

    保存的值 Select 每一次改变!想用的时候就用。

    <Select style={{ width: 200 }} onChange={(value)=>{
        this.selectValue = value;
    }}>
    

    在其他地方使用:

    console.log('Select Value', this.selectValue)
    
        2
  •  5
  •   user2248202    5 年前

    你可以通过ref得到它,antd select是rc select的hoc,如果你想得到这个值,你仍然可以通过ref.rcSelect得到它

    `the react dom`
    <Select ref={r => this.ctryListRef = r} />
    
    `the js code`
    console.log(this.ctryListRef.rcSelect.state.value)
    

    另外,您可以获得antd textArea值,这只是另一个hoc值~