Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How does WeChat Mini Programs configure pages and routing

2025-01-16 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)05/31 Report--

This article introduces the relevant knowledge of "how to configure pages and routing by WeChat Mini Programs". In the operation of actual cases, many people will encounter such a dilemma. Then let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!

I. Mini Program configuration

1. Global configuration

The app.json file under the root directory of Mini Program is used to configure WeChat Mini Programs globally, determine the path of the page file, window performance, set network timeout, set multi-tab, and so on.

/ example {"pages": ["pages/index/index", "pages/logs/index"], "window": {"navigationBarTitleText": "Demo"}, "tabBar": {"list": [{"pagePath": "pages/index/index", "text": "Home"}, {"pagePath": "pages/logs/index" "text": "log"}]}, "networkTimeout": {"request": 10000, "downloadFile": 10000}, "debug": true}

2. Page configuration

Each Mini Program page can also use a .json file with the same name to configure the window performance of this page, and the configuration items in the page will override the same configuration items in the window of app.json.

/ / example {"navigationBarBackgroundColor": "# ffffff", "navigationBarTextStyle": "black", "navigationBarTitleText": "Wechat API feature demonstration", "backgroundColor": "# eeeeee", "backgroundTextStyle": "light"}

3. Sitemap configuration

Note: the index prompt of sitemap is enabled by default. If you need to turn off the index prompt of sitemap, you can configure the field checkSiteMap to false in the setting of Mini Program project configuration file project.config.json.

The sitemap.json file in the root directory of Mini Program is used to configure whether Mini Program and its pages are allowed to be indexed by Wechat.

There are two ways to configure whether to be indexed by Wechat:

1. Page inclusion settings: the index of the entire Mini Program can be turned off, and Mini Program management backend-function-page content access-page inclusion switch

2. Sitemap configuration: the index of a specific page can be turned off.

/ / all pages will be indexed by Wechat (default) {"rules": [{"action": "allow", "page": "*"}]} / / path/to/page pages will not be indexed, the rest will be indexed {"rules": [{"action": "disallow", "page": "path/to/page"}]} II, five routes of Mini Program

1. Wx.navigateTo ()

Keep the current page and jump to a page within the application. Cannot jump to tabbar page. Mini Program has up to ten layers of page stack, and those who exceed it can use wx.redirectTo to jump.

Wx.navigateTo ({url: "list?id=2", events: {/ / the communication interface between pages, which is used to listen for data sent to the current page by the open page. SomeEvent:function (data) {console.log (data)}}, success:function (res) {/ / transfer data to the opened page via eventChannel res.evnetChannel.emit ('someEvent', {dta:'list'})})

2. Wx.redirectTo ()

Close the current page and jump to a page within the application. But you are not allowed to jump to the tabbar page.

/ / sample wx.redirectTo ({url:'list?id=2', success:function () {}, fail:function () {}})

3. Wx.switchTab ()

Jump to the tabBar page and close all other non-tabBar pages.

Wx.switchTab ({url:'/index'})

4. Wx.navigateBack ()

Close the current page and return to the previous or multi-level page. You can get the current page stack through getCurrentPages and decide how many layers you need to return.

/ / here is the wx.navigateTo of page A ({url: 'bounded pages 1'}) / / here is page B wx.navigateTo ({url: 'clocked pages 1'}) / / navigateBack within the C page, page A wx.navigateBack will be returned ({delta: 2})

5. Wx.reLaunch ()

Close all pages and open to a page within the application.

/ / sample wx.reLaunch ({url:'list?id=2'})

Note: in addition, how do the pages in the webview related to the jump jump back to Mini Program?

Wx.miniPrograme.navigateTo ({url:'pages/login/login'+'params'}) / / Jump to Mini Program's navigation page wx.miniPrograme.switchTab ({url: "/ pages/index/ index"}) "how to configure the page and routing by WeChat Mini Programs". Thank you for reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!

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.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report