How do I separate the editing area of Markdown from toolbar using vue-simplemde?

I want to emulate the editor style of GhostBlog and put the toolbar column of markdown at the bottom of the page

related codes

mounted: function () {
                var toolbarOld = document.getElementsByClassName(".editor-toolbar")
                console.log(toolbarOld)
                document.getElementById("toolbar").appendChild(toolbarOld)            
}

but I can"t get the dom node of the child component. Editor-toolbar when I use dom in the parent component.

is there any solution? Thank you

Dec.29,2021
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b40bf0-2bd86.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b40bf0-2bd86.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?