微信小程序入门的一些建议，替大家踩坑

小程序入门教程

1，建议先去看官方文档
2，说说app.json这个文件
3、app.js
4、点击事件
5、跳转页面
最后要说一下我踩的一个大坑，样式问题

1，建议先去看官方文档

微信小程序官方文档
官方文档里有下载微信开发者工具的地址，他让我们自己去注册一个小程序，其实我们可以不用注册，在新建小程序的时候会让我们输APPID，我们就直接点击下面的使用测试号，他就会为我们生成一个APPID，我们就可以来学习小程序啦（当然有需要就可以自己去注册一个APPID，也不麻烦，一下就注册好了）

2，说说app.json这个文件

1， app.json里面我们最常用到的就是"pages"这个属性。
谁在第一个，那个页面就是主页面，比如我这个是login.wxml是第一个页面，我一编译，左边显示的永远是这个login.wxml，我们在开发新的页面的时候就要把我们的新页面放在第一个。

{"pages":["pages/login/login","pages/personal/personal","pages/index/index","pages/logs/logs"],"window":{"backgroundTextStyle":"light","navigationBarBackgroundColor": "#fff","navigationBarTitleText": "Weixin","navigationBarTextStyle":"black"},"style": "v2","sitemapLocation": "sitemap.json"
}

2，当我们需要新建页面的时候，我们只需要在这里添加这个路径就行，他会自动帮我们建好。比如我想建一个personal.wxml这个页面，我们只需要在pages里添加"pages/personal/personal",，就可以了。

3，在这里要说一下，因为每个页面都可以要有3 4个文件，所以为了方便找，我们都是一个页面单独一个文件夹，这样便于我们梳理目录。

4，至于window里面的东西都是一样小程序样式的一些配置，大家可以去看文档，这里就不一一介绍了。

3、app.js

app.js里面，我们可以配置一些全局的一些变量。
比如我是这样用的：

在里面定义了一个data，然后定义了一个ctx，这个ctx是我后台的端口，我在这里定义了，在其他的js里面调用一些就ok了，到时候这个后台路径和端口改了的话，我只需要改这里，就不需要每个js都去改，这样就解耦合了。
调用

在我们要用的js的Page的上方调用，然后ctx在这个js就可以随便用啦

4、点击事件

1，常用的就是bindtap，catchtap；
(1) 相同点：首先他们都是作为点击事件函数，就是点击时触发。在这个作用上他们是一样的，可以不做区分。
(2) 不同点：他们的不同点主要是bindtap是冒泡的，catchtap是非冒泡的。

2，用法
这个是wxml：

这个是预览：

这个是js：

5、跳转页面

常用的是

 wx.navigateTo({url: '../personal/personal?user_id=111'　　// 页面 A})wx.redirectTo({url: '../personal/personal?user_id=111'　　// 页面 A})

这两个区别是navigateTo跳转后，页面上面是一个返回上一个页面的按钮，返回是返回上一个页面

而redirectTo是有一个home的标识，他会让页面回到我们的在app.json中第一个pages，就是我们的主页面。

由于我也是刚学，暂时就记录这么多，以后学的更多了，再来记录。

最后要说一下我踩的一个大坑，样式问题

我们新建了一个新的小程序项目以后会发现不管是什么都没有样式。我当时还想了很久，不会要我们开发者自己写样式吧，那这也太坑了。后来才发现是我没有引入样式。
官方的demo
把这个下载下来，把dist目录下的app.wxss里面的样式全部放到我们项目的app.wxss里就可以了。
这个demo我们还可以参考。新开一个微信开发者工具，点击导入，然后导入dist目录，就可以运行起来了。在调试器的console中可以看到页面的路径