How to create a new page in WeChat mini program

Release: 2020-03-26 16:14:12
Original
11227 people have browsed it

How to create a new page in WeChat mini program

How to create a new page in the WeChat applet and jump to this page from the homepage:

1. After creating a new project, add a directory to pages and select page, right-click the mouse, and in the pop-up menu, select Create a new folder test.

How to create a new page in WeChat mini program

2. Create a new text.wxml file under the test folder, right-click the test folder, select New wxml in the pop-up menu, and enter the file name test. Add component code

How to create a new page in WeChat mini program

#3. In the test folder, also create the test.js file

How to create a new page in WeChat mini program

4. Settings For the page title, find the directory of the page, open the test.json file (usually automatically generated, if not, create a new one), and add the following code.

{
"navigationBarTitleText": "这是test页标题"
}
Copy after login

5. Add the path of the test page to app.json, open the app.json file, and add the "pages/test/test" statement at the end of the pages code segment, separated by commas.

How to create a new page in WeChat mini program

6. Add a jump access link to the homepage, open the pages/index/index.wxml file on the homepage, and add the following code at the end to achieve page jump:

<view class="btn">
<navigator url="/pages/test/test" hover-class="navigator-hover">去test页面</navigator>
</view>
Copy after login

Recommended: "小program development tutorial"

The above is the detailed content of How to create a new page in WeChat mini program. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template