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

This article mainly introduces "how to use the views directory in vue". In the daily operation, I believe many people have doubts about how to use the views directory in vue. The editor consulted all kinds of materials and sorted out a simple and easy-to-use method of operation. I hope it will be helpful to answer the doubt of "how to use the views directory in vue". Next, please follow the editor to study!

The views directory in vue contains page-level components, that is, all kinds of pages that have been written, also known as page directories; the page components located in the views directory will be used by at least one route, and the components that need to be routed can be moved to the views directory.

This article operating environment: windows10 system, Vue2.9.6 version, DELL G3 computer.

What does the views directory put in vue?

Views is the page directory

Src/views: used to store various pages we have written, such as login, main, etc.

View1.vue page-level components, placed in the views directory, when there are subcomponents, you can create subdirectories

Expand knowledge:

Both directories src/components and src/views contain Vue components.

The key difference is that some Vue components act as views in routing.

Vue Router is usually used to deal with Vue routing, which is used to switch the current view of the component. These routes are usually placed in src/router/routes.js, and we can see the following here:

Public: used to store static files

Public/index.html: is a template file that generates the entry file for the project, and the webpack-packaged js,css is automatically injected into the page. When our browser accesses the project, the generated index.html will be opened by default.

Src: where we keep all kinds of vue files

Src/assets: used to store various static files, such as pictures, etc.

Src/compnents: used to store our common components, such as header, footer, etc.

Src/views: used to store various pages we have written, such as login, main, etc.

Src/APP.VUE: the main vue module introduces other modules, app.vue is the main component of the project, and all pages are switched under app.vue

Src/main.js: entry file, which is mainly used to initialize the vue instance, and can refer to some component libraries or hang some variables globally in this file

Src/router.js: routing file, which can be understood as the address path of each page, which is used for us to access. At the same time, we can write routing guards directly in it.

Src/store.js: mainly used to save some states in the project, save states in state, and modify states in state in mutations. Actions has not been put into practice for the time being, so I don't know how to use it.

Package.json: module basic information module, version, project name required for project development

At this point, the study on "how to use the views directory in vue" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

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.