Como verificar quantidade de caracteres de um campo Nome (string), limitar quantidade e quebrar linha (15) se necess�rio?

26/03/2020

JavaScript React Visual Studio Code HTML5

Preciso verificar a quantidade de caracteres para um campo Nome dos Instrumentos. Se tiver mais de 15 caracteres, preciso fazer uma quebra de layout e completar o texto. Como fa�o para quebrar o c�digo e manter ... (retic�ncias)? Estou utilizando o React. Como fa�o para encaixar a fun��o de verificar quantidade, limitar quantidade (30) e quebrar e usar retic�ncia(...) usando o text-overflow: ellipsis no c�digo?

Segue o c�digo:

const InstrumentName = props => {
    const instrumentModel = props.instrument.ModelName;
    const modelName = instrumentModel.split(" ")[0];
    return (
        <div className={`NameField tableInfo`} onClick={props.onClick}>
            <small></small>
            <span>
                {props.instrument.Status === CONVERTER_ON_MAINTENANCE ||
                props.instrument.Status === INSTRUMENT_ON_MAINTENANCE ? (
                    <Icon name="build" />
                ) : (
                    ""
                )}
                {props.instrument.Name}{" "}
            </span>
            {/* <i className="material-icons">
                {props.opened ? 'keyboard_arrow_down' : 'keyboard_arrow_right'}
            </i> */}
        </div>
    );

Allan Alencar

Curtir t�pico + 0

Responder