Small knowledge, big challenge! This article is participating in the creation activity of “Essential Tips for Programmers”.

Macabaca la la la la

Vue2 has a vuE-router, and uniapp has a pages. Json file to configure the route. However, if you start uni-App from Vue, you still want to set up a router, especially when it is compatible with multi-terminal development. However, if you download a vue-Router library directly from uni-app, there will be some compatibility issues.

So what to do in this dilemma? Is it a two-way street or a two-way street? Choose it, of course, it is fully functional, perfectly compatible; It is small and exquisite, rich in content; It is easy to pet and use. It is the folk library for UNI-app — UNI =simple-router;

Uni-simple-router tutorial is designed for uniApp, so you don’t need to worry about compatibility. You can also write routes and route guards like Vue2, but this doesn’t mean you don’t need to edit pages. Json. Routes in the router file need to be synchronized with routes in the pages. Json file.

So the library essentially provides a way to guard routes, jump pages, and get parameters in the same way that Vue native does.

// index
this.$Router.push({
  name: 'Login'.params: {
    from: 'index'}})// login
let from = this.$Route.query.from
Copy the code

This.$Router, this.$Route

In addition, since 2.0.0, the transfer parameters of uni-simple-router are different. If the url format of the general basic type remains unchanged

url/router? id=1

The carrying parameters are automatically encoded if they are reference types

url/router? query=%7B”status”%3Atrue,”list”%3A%5B%7B”id”%3A1%7D%5D%7D

this.$Route.query;

// {status:true, list: “{id: 1}”