[Solved] UI Component for code editor
-
Dear Quasar team,
I would like to give the user a place to input source code (E.g. Java) on the UI, could you please suggest a UI component? So far as I know, I could use text-area but it lacks of some function, for example, code line number, indentation.
Thanks! -
@Stanley Maybe you want to use markdown code highlighting? https://quasarframework.github.io/quasar-ui-qmarkdown/demo
-
@Hawkeye64 Thanks! That’s what I want.
-
@Hawkeye64 It seems that q-markdown can only display but can not edit, is that right? If yes, it can not meet my original requirement.
-
@Stanley What do you mean? Edit the output of the markdown? Or, edit the markdown?
With this component, you can create something like https://hackmd.io -
@Hawkeye64 said in UI Component for code editor:
edit the markdown?
I would like to edit the output of markdown. Actually the requirment is: in the UI, it will output some code by default, then the user can change the code as well, after that it will save to database. As you know, using textarea will fit the basic requirment, but it lacks of some function, for example, code line number and indentation which will make the code readable, as I mentioned something like code editor.
Thanks for your help! -
@Stanley The output of markdown is a lot of HTML. As for line numbers, you can look at the QMarkdown code and CSS to see how I implemented line numbers.
-
@Hawkeye64 Thanks! But I am still not sure, is it possible to edit the output of the markdown? I mean, take textarea for example, it can edit the content.
-
Finally, I got the purpose. Thank you!