微信小程序入门

Android最近不好混了,打算学学微信小程序,在这方面我绝对是很菜的菜鸟,只是大概看了遍JS 的基础语法,最基础那种,就开始想着写小程序了,因为我一直都觉得实践才是最好的学习方法。

说点题外话,Android的知识我就是这样学过来的,现在也能做做应用,一般的功能啊什么的没问题,公司里面写代码速度,对接口的速度啊应该也不差,但是咧,java基础就真的不好了,一般面试的时候问到各种知识都答不上来,所以啊会做有时候并没有什么用,会说有时候真的很好用···但是现在有空再回去翻一遍java的话估计会好很多,等我有耐心的时候吧。

扯远了,回来继续,打算先做点东西出来,回头再继续补JS和CSS,H5的话其实在小程序里用的不是特别多,因为控件都换成自带的了。

0基础:先看点JS语法咯,大概看一遍也好,再过一遍微信的官方文档,我觉得开发工具那里仔细看看吧,对着开发工具看,记得把demo也下了,运行来到处戳戳就好。

微信官方文档

小程序开发工具下载地址

下面讲讲基本配置

微信小程序入门_第1张图片
小程序demo目录

这个就是小程序目录了,
app.js文件是全局配置,现在不用管

app.json比较重要,页面配置啊,什么的都在里面,一会有用到

app.wxss全局CSS的配置

微信小程序入门_第2张图片
新建页面

先新建个目录,比如叫 test
目录下新建两个文件,js和wxml是必须的,其它的不管
建好了以后就这样子

样子

文字里面是空的,啥都木有

先打开 wxml 文件
随便加个东西

text{{me}}

就加个文本吧,text是文字后面双括号的是变量,可以在js里面配置

接着js里面打个page按确定就自动生成基本函数了

Page({
  data:{
    me:"文字"
  },
  onLoad:function(options){
    // 页面初始化 options为页面跳转所带来的参数
    String2
  },
  onReady:function(){
    // 页面渲染完成
    String3
  },
  onShow:function(){
    // 页面显示
    String4
  },
  onHide:function(){
    // 页面隐藏
    String5
  },
  onUnload:function(){
    // 页面关闭
    String6
  }
})

me:"文字"这个是我加上去的,绑定wxml里面的那个变量,很容易理解。

哦很重要的一点,改了数据后记得按 ctrl+s去保存才有用,表示用AS过来的新手很不习惯,每次更改都要手动保存,难道不能自动保存么。

最后要加上很重要的一点就是在上文说过的那个app.json里面配置一下
"pages/test/test"

微信小程序入门_第3张图片
配置

别忘了前面要加上 逗号

在自动生成的index.js里面加个跳转,点击头像跳到自己刚配置的页面
url: '../test/test'

微信小程序入门_第4张图片
增加跳转

好了,运行一下

微信小程序入门_第5张图片
效果

最最最基本的效果了,后面的话去看看官方文档就慢慢会了,我也在努力学习中~

你可能感兴趣的:(微信小程序入门)