Get current line number

1

Hello, Is there anyway to get the current lineNumber ?
eg If I am on line number 4 it should return 4 or if I am on 2 it should return 2
Thanks in advance

2

editor.getCursor().line or, in version 6, state.doc.lineAt(state.selection.main.head).number.

1 Like
3

thanks @marijn it works

4 
import React, { useEffect, useRef, useState} from "react";

// Code Mirror for colorfull ui of code editor
import CodeMirror, { useCodeMirror } from '@uiw/react-codemirror';
import { javascript } from '@codemirror/lang-javascript';
import { oneDark } from '@codemirror/theme-one-dark';

// Redux modules
import { useSelector } from "react-redux";
// styles
import './style.css';

const CodeSection = () => {

    const algorithm  = useSelector(state => state.algorithm); // getting state from redux states
    const code = algorithm.code ? algorithm.code : '//Select an algorithm';

    const editor = useRef(); // Refering to the text editor.

    const [ codeValue, setCodeValue ] = useState(code); // Local States

    const handleAlgoChange = (e) => {
        setCodeValue(e)
    }

    // console.log(codeValue);

    const { setContainer } = useCodeMirror({
        container: editor.current,
        extensions: [javascript()],
        value: codeValue, 
        theme: oneDark,
        onChange: handleAlgoChange,
        height: '100%',
    });

    useEffect(() => {
        if (editor.current) {
            setContainer(editor.current);
        }
    }, [editor.current]);



    return(
        <div className="code-section-main-div">
            <div className="code-section-header">
                {/* Header part Goes Here */}
                <label className="filename-heading">
                    {algorithm.title ? algorithm.title : 'algorithm'}.{algorithm.ext ? algorithm.ext : 'ext'}
                </label>
            </div>

            <div className="code-section-body">
                <div className="code-section-body-div" ref={editor}></div>
            </div>
        </div>
    );
}

export default CodeSection;

My code is this. and I am trying to get the current line number for many days. I have followed tutorials and blogs but I do not get any relevant solution. can you help me out how to get the current line number.

5

@bikymandal I am using that on updateListener event like this
I am simply following the official documentation
This updateListener has to wrap in EditorState.create method

I am pushing lineNumber and time in array

import { basicSetup, EditorView } from '@codemirror/basic-setup';
import {EditorState, Compartment} from "@codemirror/state"

EditorView.updateListener.of((v)=> {
 if(v.docChanged) {
   if(timer) clearTimeout(timer);
   timer = setTimeout(() => {
   // Store Line Number and current time in array
   timeSeries.push({
     time:Date.now,lineNumber:view.state.doc.lineAt(view.state.selection.main.head).number})
     }, 1000 );
    }
  })