MDBBtn text value

web
mobile

Topic: MDBBtn text value

afshinshahpari@gmail.com asked 11 months ago

How can I get the current text value of MDBBtn( in this example : MyText ) , I used this.value but the function that is called says its undefined.

<MDBBtn onClick={() => this.GetValue(this.value)}>
    MyText
</MDBBtn>

Aliaksandr Andrasiuk staff answered 11 months ago

Hi,

We have no native method which allows to get text value, but you can get text using next approaches:

1) using document.querySelector:

import React from 'react';
import { MDBBtn } from 'mdbreact';

const Button = () => {
  const getTextValue = () =>
    console.log(document.querySelector('#btn').textContent);

  return (
    <MDBBtn color='primary' id='btn' onClick={getTextValue}>
      Primary
    </MDBBtn>
  );
};

export default Button;

2) using ref:

import React from 'react';
import { MDBBtn } from 'mdbreact';

const Button = () => {
  const btnRef = React.createRef();

  const getTextValue = () => {
    console.log(btnRef.current.textContent)
  };

  return (
    <MDBBtn color='primary' innerRef={btnRef} onClick={getTextValue}>
      Primary
    </MDBBtn>
  );
};

export default Button;

Hope I could help.

Best regards.


Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: React
  • MDB Version: 4.19.0
  • Device: mac
  • Browser: chrome
  • OS: macos
  • Provided sample code: No
  • Provided link: No
Tags