高端响应式模板免费下载

响应式网页设计、开放源代码、永久使用、不限域名、不限使用次数

什么是响应式网页设计?

2024年谈谈对微信小程序的认识(共3篇)

谈谈对微信小程序的认识 第1篇

    第一个微信小程序

运行微信开发工具,管理员使用“微信客户端”扫描二维码进行登录后选择左边菜单栏的“小程序”一项

单击加号新建小程序,填写项目名Chapter01,选择项目所在路径。关于APPID的填写,如果是正式项目可填写在小程序管理平台创建的APPID。如果仅是用于测试与学习,不打算正式发布小程序,亦可以选择测试号,这时会随机生成一个APPID。

单击新建按钮,项目新建完毕,进入开发工具首页。

 开发工具页面介绍

项目新建完成后进入开发工具首页

 项目导入—微信小程序示例

为了更快的学习小程序的开发,有时候会到GitHub官网下载别人的项目进行导入学习,微信官方为开发者提供了一个叫“微信小程序示例”的小程序项目 项目地址为: 项目下载完毕后接下来进行导入的工作,具体步骤如下:

打开微信开发工具,在之前新建项目的首页选择导入项目,再选择项目目录,单击导入即可

在开发者工具主界面,单击顶部菜单栏的 项目”→“导入项目”也能进入引导页,开发者工具允许同时打开多个项目窗口,并且这些项目的开发调试互不影响

项目导入成功后在主界面可看到该项目的目录结构、源代码和运行效果

谈谈对微信小程序的认识 第2篇

完整的小程序项目的目录结构

新建页面的3种方法

在pages目录下新建一个文件夹test,在test文件夹右键新建一个page(页面),也命名为test。这时的pages数组自动添加该页面的路径。

右键pages目录,选择硬盘打开,在本地目录中新建存放页面的文件夹,再新建4种文件。不过此方法不会触发微信开发工具在文件的pages数组中添加页面的路径,需要在文件里手动添加,否则无法完成页面的路由等工作。

直接在文件的pages数组里的最上面一排写上页面的路径,保存后会发现项目重启后自动进入新建的页面,代码如下所示:

页面布局文件

文件是页面的描述文件,在此文件里,开发者需要根据小程序的具体功能自行编写类似于Html一样的标签代码。在浏览器打开任意网页,按F12开启调试窗口,可以看到网页的Html源代码类似于:

而在小程序的文件里则类似于:

这是一些可以嵌套其他标签的内容

页面样式文件

是页面的样式文件,可选。此文件与Html的CSS文件语法基本一致,不同之处在与其自定义了一个新的尺寸单位rpx 以及新增了import关键字进行公共样式的导入。

尺寸单位

小程序规定了全新的尺寸单位rpx(responsive pixel),可以根据屏幕宽度进行自适应。其原理是无视设备原先的尺寸大小,统一规定屏幕宽度为750rpx。rpx不是固定值,屏幕越大,1rpx对应的像素就越大。

样式导入

小程序在WXSS样式文件中使用@import语句导入外联样式表,@import后跟需要导入的外联样式表的相对路径,用英文分号“;”表示语句结束。其使用步骤如下:

(1)定义公共样式表   代码如下:

(2)在样式表中使用@import语句对其进行引用,此时,相当于在新的里多了名为background-image1的样式,代码如下:

 两种关联样式的方式

小程序框架组件上支持使用 style和class 属性来控制组件的样式。style仅用于设置少量需要动态更改的样式属性,而class通过选择器选择的静态样式全部写入wxss文件。

style:利用style动态接收样式时,组件中的文本颜色可由页面JS文件的属性动态改变,代码如下:

class:小程序使用class属性指定样式规则,其属性值是一个或多个自定义样式类名组成,多个样式类名之间用空格分隔。

选择器

程序目前在wxss样式表中支持的选择器如右表所示:

页面配置文件

页面配置文件中可进行页面窗口的个性化配置,并覆盖中关于window属性的配置内容,节全局配置文件中关于窗口的配置代码如下:

 在页面的json文件可进行类似配置,且由于页面单独的json文件只针对当前页面,因此可省略window属性,如下述代码所示:

页面逻辑文件

文件里面主要是JavaScript代码,用于控制页面的交互逻辑。与类似,每个页面的文件也调用一个Page方法,并传入Page函数所需的参数以完成页面的初始化工作。如Chapter01的的部分示例代码如下:

谈谈对微信小程序的认识 第3篇

在 的 pages 选项中,新增页面路径即可

在新增页面目录以后,会自动在 pages 目录下生成页面文件

小程序调试基础库是指 微信开发者工具中可以选择的微信基础库版本。

微信基础库是指小程序的运行环境,给小程序提供了运行所需的各种 API 和工具,以及基础框架和运行逻辑等。

小程序开发者可以在微信开发者工具中选择所需的微信基础库版本,作为运行和调试小程序时的运行环境。

每个小程序有自己所允许使用的基础库最低版本要求,开发者需要选择要兼容的基础库版本,从而确保小程序的功能正常运行。

假设我们目前已经使用微信开发者工具,按照小程序的开发规范完成了小程序的全部的全部开发工作,并且完成了本地测试,

这时候我们需要开发对小程序进行发布,小程序上线的流程如下:

体验版本:小程序开发者可以将开发版本转换为体验版本,由测试人员以及产品经理进行测试与体验,确认没问题可提交审核

审核版本:小程序开发者可以将开发版本转换为审核版本,由微信的审核团队进行审核,审核周期为1~7天,审核通过可提交发布

线上版本:通过微信小程序平台审核,并由开发者提交发布的正式版本,线上版本是用户可以正常使用的小程序版本

猜你喜欢