微信小程序 学习笔记（二）了解他的组成

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了微信小程序 学习笔记（二）了解他的组成，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含1931字，纯文字阅读大概需要3分钟。

内容图文

继续-》》

 在app.json 文件的pages 下写一个想要的名字 ，然后Ctrl+S保存 自动会生成四个文件：.js .json .wxml .wxss

 .wxml :类似html 

 看一下常用标签:

<view> 类似于div
<button> 按钮
<form>表单
<image>图片
<text> 文本
<icon>图标
<checkbox> 复选框
<radio>单选框
<input>输入框
<progress>进度条

wxss 样式

选择器：类似

#id       　　   id="balabala"

.class     　　class="balabala"

element 　　 view

::after 　　　 view::after

::before 　　  view:before

根据屏幕大小改变的 rpx

引用外来样式：

@import "../index/index.wxss";

可以把全局样式写到：app.wxss

当然页面本身的样式优先级要高于 全局样式。

.js

打开js文件。可以看到生命周期函数和事件处理函数。注解已帮我们写好。

生命周期：

onLoad：监听页面加载，一个页面只会调用一次。

onReady：监听页面初次渲染完成。一个页面只会调用一次。

onShow：监听页面显示。例如，从后台切入前台时触发。

onHide：监听页面隐藏。例如，从前台切入后台时触发。

onUnload：监听页面卸载。例如，使用路由API中的wx.redirectTo()或wx.navigateBack()跳转其他页面时触发。

 

 事件处理函数：

 

 .json 配置文件

app.json是应用级配置文件；我们自己创建的是页面级配置文件。

在页面及配置文件中我们可以改变：导航栏样式、是否允许滚动条等等。

 

 

bind 绑定：

　　tap：点击事件；

　　longtap：长按事件；

　　touchstart：触摸开始；

　　touchend：触摸结束；

　　touchcancel：取消触摸；

 

单击“?”会在底部弹出一个菜单，在菜单中有一项“转发”，单击转发就会触发onShareAppMessage 事件。单击“⊙”可以在前台、后台之间切换，通过此按钮可以测试onShow和onHide事件

debug：

 "debug": true

 弹窗：

1.

 

 代码：

wx.showToast({
        title: '暗号错误！',
        icon: 'none',
        duration: 1500
})

2.

 代码：

wx.showModal({
        title: '提示',
        content: '是否跳转？',
        success: function (res) {
          if (res.confirm) {//这里是点击了确定以后
            console.log('用户点击确定')
          } else {//这里是点击了取消以后
            console.log('用户点击取消')
          }
        }
})

 跳转：

1.后台 参数：url ,success ,fail ,complete

wx.navigateTo(OBJECT)

2.跳转到应用的某个页面 参数：url ,success ,fail ,complete

wx.redirectTo(OBJECT) 

3.返回上一页 参数：data

wx.navigateBack(OBJECT) 

 

等有时间 待完成

 

@

内容总结

以上是互联网集市为您收集整理的微信小程序 学习笔记（二）了解他的组成全部内容，希望文章能够帮你解决微信小程序 学习笔记（二）了解他的组成所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

---