对小程序的初了解

WXML和HTML的区别

标签名称不同

HTML:div、a、span、img

WXML:view、text、image、navigator

属性节点不同

<a href="#">超链接</a>

<navigator url="/pages/home/home"></navigator>

提供了类似vue的模板语法

数据绑定

列表渲染

条件渲染

WXSS 和 CSS 的区别

新增了 rpx 尺寸单位

提供了全局的样式和局部样式

根目录 app.wxss 会作用于所有小程序

局部页面的 .wxss 样式仅对当前页面生效

wxss仅支持部分css选择器

.class 和 #id

element

并集选择器 和 后代选择器

::after 和 ::before 等伪类选择器

小程序的 .js 文件

app.js

整个小程序项目的入口文件,通过APP函数来启动整个小程序

页面的 .js

页面的入口文件通过 Page() 函数来创建并运行页面

普通的 .js文件

是普通功能模块文件,用于封装公共的函数或属性供页面使用

小程序的组件

视图组件

view:普通视图区域

           类似于HTML 中的div,块级元素

            常用来实现页面的布局效果

scroll-view:可滚动的视图区域

                     常用来实现滚动列表效果

swiper 和 swiper-item:轮播图组件和轮播图item组件

常用的基础内容组件

text:文本组件  类似于span ,行内元素

手机号支持长按选中效果:<text selectable>110</text>

rich-text:富文本组件,支持把HTML字符串渲染成 WXML 结构

<rich-text nodes="<h1 style="color:red;">标题</h1>"></rich-text>
把HTML字符串渲染成对应的UI结构

其他常用组件

button:按钮组件(type="",size="",plain 镂空)

              通过open-type 属性可以调用 微信提供的各种功能(客服、转发、获取用户授权)

image:图片组件

              image组件默认宽度 300px,高度约240px

navigator:导航组件

小程序API的3大分类

事件监听API

特点:

  • 以on开头,用来监听某些事件的触发。
  • wx.onWindowResize 监听窗口尺寸变化的事件

同步API

特点:

  • 以sync结尾的API都是同步API
  • 同步API的执行结果,可以通过函数返回值直接获取,如果执行出错会抛出异常
  • wx.setStorageSync('key','value')  向本地存储中写入内容

异步API

特点:

  • 类似于jquery中$.ajax(options) 函数需通过success、fail、complete接收调用的结果
  • wx.request()发起网络数据请求,通过success回调函数接收数据

相关推荐

  1. 识微信程序之swiper和swiper-item基本使用

    2023-12-05 20:34:06       7 阅读

最近更新

  1. TCP协议是安全的吗?

    2023-12-05 20:34:06       16 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2023-12-05 20:34:06       16 阅读
  3. 【Python教程】压缩PDF文件大小

    2023-12-05 20:34:06       15 阅读
  4. 通过文章id递归查询所有评论(xml)

    2023-12-05 20:34:06       18 阅读

热门阅读

  1. 常用类与比较器

    2023-12-05 20:34:06       35 阅读
  2. Leetcode128.最长连续序列

    2023-12-05 20:34:06       32 阅读
  3. 如何保护 API 安全

    2023-12-05 20:34:06       40 阅读
  4. Diary17-Word页面设计

    2023-12-05 20:34:06       47 阅读
  5. 【lua】获取某月最大天数

    2023-12-05 20:34:06       30 阅读
  6. 【Android 线程】在子线程中更新UI

    2023-12-05 20:34:06       39 阅读
  7. spark学习一-------------------Spark算子最详细介绍

    2023-12-05 20:34:06       35 阅读
  8. 再探Docker:从Docker基础到跨服务器部署

    2023-12-05 20:34:06       24 阅读
  9. SSL证书认证对搜索引擎有影响吗?

    2023-12-05 20:34:06       43 阅读
  10. 如何判别使用的junit是4还是5

    2023-12-05 20:34:06       31 阅读