微信小程序基础介绍

news/2024/7/20 1:05:37 标签: 小程序

微信小程序基础介绍

什么是微信小程序

微信小程序本质上就是一个计算机软件程序,不同与APP,它依赖与微信平台,可以理解为是嵌套在微信平台中的一个APP。

微信小程序的优缺点

优点

  • 不需要安装,省去了安装的麻烦
  • 体积小,节省手机空间
  • 使得手机桌面更加简洁
  • 可以依靠微信平台传播、获取客户,节省了推广成本
  • 开发周期短,节省了开发成本
  • 开发门槛相对较低
  • 连接线上线下,给生活带来了便利…

缺点

  • 微信小程序整个体系依赖于微信
  • 推送消息有诸多限制
  • 小程序不能承载用户的所有需求

与其他相关概念的区别

与H5的区别

本质上是两种不同的东西:小程序是计算机程序,H5则是互联网网页

对用户而言,在微信中使用小程序,会比H5流畅很多

对开发者而言,相比H5,小程序可以节省大量的服务器资源

与公众号、订阅号、服务号、企业微信的区别

公众号:能被公众看到的信息平台。范围最广,包括了订阅号、服务号、企业微信和微信小程序

订阅号:是用户在微信中订阅文章所使用的公众账号。

服务号:是一种服务导向的公众账号。

注意:订阅号和服务号以【聊天界面】为基础,它们的功能和界面早就规定好了的

企业微信:一般为企业所有,受众一般是这个企业的员工。

小程序:可简单理解成嵌入微信的app,如果你想快速的开发一个应用,并且这个应用的功能没有很复杂,可以考虑使用小程序

注意:小程序允许开发者自定义界面,不用局限于微信的聊天界面。

微信小程序开发

1.下载安装微信小程序开发工具

2.代码结构:

在这里插入图片描述

  • pages:包含两个目录:index、logs,小程序包含的页面

    • 每个页面都有一个独立的文件夹

    • 每个页面包含了4个文件:js页面逻辑,json页面配置,wxss页面样式,wxml页面结构

    • 页面样式可覆盖全局样式(页面样式的优先级更高),页面配置可覆盖全局配置

  • utis:工具类

  • app.js:全局逻辑处理文件

  • app.json:全局配置文件

  • app.wxss:全局样式文件

  • project.config.json:整个项目的配置文件

  • sitemap.json::用来配置小程序及其页面是否允许被微信索引

注意:app.js,app.json,app.wxss放置在项目的根目录下,作为全局文件,是小程序的框架配置文件。

小程序的页面组成

一个页面由4个文件所组成,涉及到3个技术:WXML,WXSS,JS

1. WXML

微信标记语言

类似于HTML,用于描述页面结构。

WXML和HTML最大的差异在于标签。大部分的HTML标签都被所替代,最接近于HTML里的

逻辑分块的标签。

WXML语法:

数据绑定:在wxml中使用变量,然后在js中给变量赋值

条件渲染:

<view wx:if="{{var<10}}">hello,world!</view><!--需要在js中定义一个变量var-->
<view wx:elif="{{var<6}}">yangdaxain</view>
<view wx:else>xiaoluo</view>

事件绑定:onclick、mousemove等

2. WXSS

微信样式表
注意:
在这里插入图片描述

3. JS

JavaScript 用于处理页面和用户的交互。小程序的逻辑功能使用JS来实现。

JS常见的数据类型:

数字:JS的数字类型不区分整数和浮点数,统一用Number表示

字符串:以单引号或双引号括起来的任意文本

布尔值:true/false

数组:[data1,data2,…datan]

JS对象:{key1:value1,key2:value2,…keyn:valuen}


http://www.niftyadmin.cn/n/686743.html

相关文章

河北:明年县级以上城市将实现免费无线上网

中秋小长假期间&#xff0c;家住北京的王新明老人带着家人到河北承德旅游。在双滦区刚下火车&#xff0c;他就发现手机提示搜到了WiFi信号&#xff0c;试着一连接&#xff0c;立刻就通了。 京津冀协同发展战略开局之后&#xff0c;河北与外界的联络大大提速  承德双滦区开通全…

BS程序怎样通过浏览器了解点击响应时间

原创作品&#xff0c;出自 “深蓝的blog” 博客。欢迎转载&#xff0c;转载时请务必注明出处&#xff0c;否则有权追究版权法律责任。 深蓝的blog&#xff1a;http://blog.csdn.net/huangyanlong/article/details/46453039 B/S程序怎样通过浏览器了解界面响应时间 近期在给应用…

【软件测试】如何做好接口测试?

1. 首先&#xff0c;什么是接口? 接口无非有两种&#xff0c;一种是内部接口&#xff0c;一种调用对外包装的接口 内部接口&#xff1a;方法与方法之间&#xff0c;模块与模块之间的交互&#xff0c;程序内部抛出的接口&#xff0c;例如下订单&#xff0c;首先你需要登录&am…

数据模型

数据模型 python数据模型是对python框架的描述&#xff0c;主要内容就是python特殊方法的使用 通过使用特殊方法&#xff0c;我们使自己定义的对象能够被一些函数所支持 意思就是说在自定义的类中实现了某些特殊方法&#xff0c; 那么类的实例对象就可以直接调用python的一…

Cashman稳掌舵轮:EMC营收下滑但利润提升

EMC公司在2016年第一季度营收为55亿美元&#xff0c;较上年同期的56亿美元下滑2%。不过利润额则达到2.68亿美元&#xff0c;同比增长6.3%。迎来略逊于上年同期的营收水平&#xff0c;其中南美洲市场表现尤为糟糕。 第一季度中的财报表现始终弱于上年第四季度&#xff0c;此番亦…

还在背面试题?自动化测试与手工测试优、劣势(面试经常问)看看大厂软件测试总监怎么说!

既然现在有了自动化测试&#xff0c;甚至现在许多团队在使用人工智能的方法&#xff0c;逐渐让机器来取代人的测试。那么作为测试工程师的人未来会不会消失? 回答这个问题前&#xff0c;先来看一下自动化测试优势和劣势。 一、自动化测试的优势 1.1 自动化测试可以执行手工测…

appium使用之元素定位

appium使用之元素定位 使用appium时&#xff0c;可以使用各种各样的元素定位方式&#xff0c;先来看一下这些元素在哪&#xff0c;如下图 在appium中可以找到的属性都在这里 id定位 driver.find_element_by_id() #这里填入的id就是resource-id #如果resource-id重复&#xf…

深入理解C语言函数传参方式

一 背景 如果问C语言函数传参方式&#xff0c;大多数人答案是值传递和地址传递。值传递不改变原参的值&#xff0c;而地址传递&#xff08;指针&#xff09;传递会改变原参的值。 但实际上所有的传参方式有且仅有一种&#xff0c;就是值传递。值传递和地址传递都是通过拷贝实…