微信小程序学习笔记（一）

微信小程序学习笔记（一）

1. 在项目的pages目录下新建test目录，以及test目录下的one.js、one.json、one.wxml、one.wxss。

 

2. 代码：

(1) one.wxml

<view class="container">
<text>这是第一个页面</text>
</view>

(2) one.js

var app=getApp()
Page({
 
/**
* 页面的初始数据
*/
data: {
userInfo: {}
},
 
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
wx.showLoading({
title: '全力加载中...',
})
},
 
})

(3) 在app.json中添加“pages/test/one”，如下：

 

注：app.json

该文件中存放的公共配置，格式就是json，其中pages是必须要配置的，程序中的每一个页面，都需要在这里配置，否则页面会找不到。 
window属性配置的是一些窗口属性。

 

(4) 在index.wxml中添加navigator 页面链接：

<view class="btn-area">
<navigator url="/pages/test/one" hover-class="navigater-hover">跳转到one页面</navigator>
</view>
 
 

如下：

 

3. 运行结果如下：

点击跳转到one页面。