Webide Second blog post

This is my second post in the process of webide, the reason why so long no more, because there is no progress ah, there is nothing to write, now although there is still no progress, but encountered a lot of holes in the middle, these pits are still recorded in the necessary.

Due to personal level problems, there may be some places that are wrong, or the realization of ideas have problems, please correct me. Thanks

Through our continuous project iteration, splitting, divides it into three parts, the left tree, the right upper tabs, the right side of the lower coding area, respectively, with three components to achieve their respective functions.

At first, I used Elementui filetree to do the file tree->fi ' Lder components, tabs do the upper Tabs->tabs components, Codemirror do code area->editor components

Later found that the content of the tabs component is a plain text type, and rendered a lot of layers, add a lot of classes to change it very laborious-can be customized too poor, later if there are other needs to change more laborious, directly wrote a tabs component, their own writing tabs process also stepped a lot of pits, for example, Tabs just started with a label that needed to pass values to the component when using the tabs component, traverse the tabs component, and later find that the editor and tabs and the parent File.vue were too frequent before, and put the array of components into the tabs component and loop through the components.

One of them I wrote to deal with the past show, and so I slowly have time, the ability to re-optimize, that is, Tabs tab tag has two sets, four states, point to the right plus new files, points to the left of the directory tree to open the previous file, and they are in a positive edit state or background open state, I gave it a definition of four classes, different CSS, and then to judge.   This led to my code a lot if ... else ... No beauty at all, this has to be optimized.

There is a pit is, Tabs tab and editor do not correspond well, open display, save no problem. However, when you remove tab from the right side of the tab, tab is the right one, but the editor display does not match the tab. That's the point I'm going to make tomorrow.

That's what I do with the style of this website, for example Orz

Webide Second blog post