1. The process
The store can be changed when a request (url redirect request) enters the NuxTServerInit hook first
Then walk by the middleware that must walk before
Middware checks permissions and then checks data and sends requests when it gets to the page
AsyncData sends the request fetch mainly to fill the state of the store/ / the difference between
Copy the code
Then the jump will walk again by the previous middleware loop
Vue client lifecycle note that created is created on both the server and client, so Windows cannot be performed. Vue lifecycle is executed after render
2. The directory
1. Router.js of routes in. Nuxt is automatically generated in pages
2. File layouts
3 middlewares are the routes that go through before they are routed
4. Server writes koA code to do node background
5. Static Does not package Assets
6. Nuxt. config indicates the configuration
7.. You don’t have to change it in NUXT because it’s automatically generated every time you run it
3. The routing
Embedded routines by
You must have the detail folder and the detail.vue file with nuxt-Child in it for nested routes to be automatically generated
Nuxt-child is like router-view and the contents of nuxt-Child are the contents of the detail folder
Dynamic routing
Create _id. Vue to pass the subfile
$route.params.id to get the id parameterCopy the code
4. Route navigation redirects
Nuxt-link is equivalent to router-link
In general, the home page will load all the JS of the login and details page. If you do not want to add no-prefetch, then we click the corresponding route before downloading
5.nuxt.config.js
1. The router can be configured
Website www.nuxtjs.cn/api/configu…
I’m going to change routes and I’m going to change otherName in Pages to our login
Login works and the othername route works so it’s probably best not to write it in the pages component or we’ll delete the othername route in this configuration
And then the last path that this route doesn’t match is 404
6. View
These eight attributes are written in the Export Defult object (more than the original VUE) for the current component
AsyncData and FETCH both fetch asynchronous data
AsyncData sends the request fetch mainly to fill the state of the store/ / the difference between
Copy the code
The head thing that redefines the head on a page is that the function returns the corresponding head configuration
Website: www.nuxtjs.cn/guide/views
AsyncData Asynchronous data
axios
The middleware
Before walking is walking middleware
Middleware exports like KOA are functions
The global configuration is in the router of nuxt.config.js
Set up middleware for a single page (routing)
store
This is the user.js code under store
Direct a file directly to store for modularization
Later access through store.user.token