微信小程序目录结构、事件处理、网络请求

简介: 微信小程序目录结构、事件处理、网络请求

微信小程序是一种全新的连接用户与服务的方式,它可以在微信内被便捷地获取和传播,同时具有出色的使用体验。


一.目录结构

image.png



1.app.js里面是一些全局的函数,比如获取用户信息(微信头像用户名)


image.png

2.app.json是全局的配置(有点像android中的manifest),还有窗体的color、title等


image.png

3.app.wxss相当于html中的css

image.png

4.pages目录下的是基本的页面结构,初始化是index文件夹,其下有index.js、index.wxml、index.wxss三个文件

image.png

# index.js中是函数处理


# index.wxml中是view界面


# index.wxss中是样式设置


所以说一个页面实际是需要三个文件的。


5.添加文件


img文件夹是我自己添加的,用来放图片


main和list也是添加的文件


添加文件需要放在父级目录后面的加号

image.png

添加的.wxml的文件需要在app.json里面添加配置!!!


而且编辑页面之后一定要保存ctrl+s!!!


保存之后才会编译


二.事件处理


1.比如首页的点击跳转


image.png

1)index.wxml布局。用bindtap绑定事件


image.png


2)index.js做事件处理

image.png

wx.navigateTo是跳转API,url指定跳转的页面


2.toast,dialog,加载图片

image.png



1)布局

image.png


2)代码

image.png


3.关于事件绑定

image.png



三.请求网络


1)布局只是一个button


<view><button bindtap="request">request</button></view>


2)请求代码

image.png

3)请求结果之后(成功弹了一个toast)

image.png

目录
相关文章
|
8月前
|
机器学习/深度学习 人工智能 运维
AI“捕风捉影”:深度学习如何让网络事件检测更智能?
AI“捕风捉影”:深度学习如何让网络事件检测更智能?
314 8
|
10月前
|
小程序
微信小程序数据绑定与事件处理:打造动态交互体验
在上一篇中,我们学习了搭建微信小程序开发环境并创建“Hello World”页面。本文深入探讨数据绑定和事件处理机制,通过具体案例帮助你打造更具交互性的小程序。数据绑定使用双花括号`{{}}`语法,实现页面与逻辑层数据的动态关联;事件处理则通过`bind`或`catch`前缀响应用户操作。最后,通过一个简单的计数器案例,巩固所学知识。掌握这些核心技能,将助你开发更复杂的小程序。
|
10月前
|
缓存 小程序 API
微信小程序网络请求与API调用:实现数据交互
本文深入探讨了微信小程序的网络请求与API调用,涵盖`wx.request`的基本用法、常见场景(如获取数据、提交表单、上传和下载文件)及注意事项(如域名配置、HTTPS协议、超时设置和并发限制)。通过一个简单案例,演示了如何实现小程序与服务器的数据交互。掌握这些技能将帮助你构建功能更丰富的应用。
|
JSON 小程序 前端开发
微信小程序的目录结构及页面结构的说明
本文详细介绍了微信小程序的目录结构、页面组成部分以及项目的全局配置文件,阐述了小程序的宿主环境和运行机制,包括小程序启动和页面渲染的过程。
微信小程序的目录结构及页面结构的说明
|
监控 安全 Linux
网络安全事件应急响应
应急响应是针对网络安全事件的快速处理流程,包括信息收集、事件判断、深入分析、清理处置、报告产出等环节。具体步骤涵盖准备、检测、抑制、根除、恢复和总结。
|
小程序 开发者
微信小程序之网络数据请求 wx:request的简单使用
这篇文章介绍了微信小程序中如何使用wx.request进行网络数据请求,包括请求的配置、请求的格式以及如何在开发阶段关闭请求的合法检验。
微信小程序之网络数据请求 wx:request的简单使用
|
小程序 JavaScript
微信小程序学习之数据绑定,事件绑定,事件传参与数据同步的学习记录
本文介绍了微信小程序中的数据绑定、事件绑定、事件传参与数据同步的基本概念和使用方法,包括如何在data对象中定义数据、使用mustache语法在wxml中渲染数据、绑定和处理事件、事件对象属性、事件传参以及实现输入框与data数据的同步。
微信小程序学习之数据绑定,事件绑定,事件传参与数据同步的学习记录
|
小程序 数据安全/隐私保护
Taro@3.x+Vue@3.x+TS开发微信小程序,网络请求封装
在 `src/http` 目录下创建 `request.ts` 文件,并配置 Taro 的网络请求方法 `Taro.request`,支持多种 HTTP 方法并处理数据加密。
597 0
Taro@3.x+Vue@3.x+TS开发微信小程序,网络请求封装
|
JSON 小程序 JavaScript
微信小程序页面事件,下拉刷新事件和上拉触底事件
这篇文章介绍了微信小程序中如何实现下拉刷新和上拉触底事件,包括开启下拉刷新、配置下拉刷新样式、监听下拉刷新事件,以及监听上拉触底事件和配置上拉触底的距离。
|
JSON 小程序 JavaScript
uni-app开发微信小程序的报错[渲染层错误]排查及解决
uni-app开发微信小程序的报错[渲染层错误]排查及解决
3166 7

热门文章

最新文章