Shulou(Shulou.com)06/03 Report--

This article will explain in detail how layuiadmin makes tabs on the head. Xiaobian thinks it is quite practical, so share it with you for reference. I hope you can gain something after reading this article.

1. First of all, let's talk about the left menu bar. This is the most basic left menu bar. The implementation process is very simple. The official description document is there, but after importing layer.js, I directly copy this official code to my editor.

2. The menu of binding properties does not have drop-down options. This problem was solved after I imported layer.all.js, and I found that if it is imported at the top of the page, there is no drop-down option. Only when imported under html code can it be displayed.

3. Tab right-click menu: The style of the right-click menu here is not too much beautification. Tab switching function, switching event listening, etc., need to rely on element module.

4. Add a Tab item and pass three parameters, corresponding to its title, the address of the tab page, and a specified id, which is the attribute value of data-id in the tag.

5, according to the passed id passed to the specified tab item, ids is an array, which stores multiple ids, call the tabDelete method to delete them respectively.

6. The content in the left menu bar triggers the number of li with lay-id attribute under the click event attribute, that is, the number of tab items that have been opened. Initialize a flag. If it is false, it means that the tab item has not been opened. If it is true, it means that there is.

About "layuiadmin how to make tabs on the head" this article is shared here, I hope the above content can be of some help to everyone, so that you can learn more knowledge, if you think the article is good, please share it to let more people see.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.