5 分钟带你小程序入门 [实战总结分享]

分钟带你小程序入门

微信小程序常常用 4 种文件类型

JS 文件

JS 在小程序中用于编写页面逻辑和交互效果,可调用 API 接口完成数据请求和处理,也可以使用第三方库和框架。
分钟带你小程序入门

  1. 模块化编程:小程序中JS文件可以使用ES6的模块化语法,通过export和import来导出和导入模块。
  2. 引用其他JS文件:小程序中的JS文件可以通过require来引入其他的JS文件,如utils、model等。
  3. 事件处理:小程序中的事件处理非常重要,需要注意事件的绑定和触发,以及事件参数的传递和处理。
  4. 数据绑定和更新:小程序中的数据绑定和更新是自动的,但也需要注意一些细节,如数据类型的转换和更新时机等。
  5. API调用:小程序提供了很多API供开发者使用,需要注意选择正确的API并正确调用。
  6. 错误处理:小程序中JS出错会导致页面崩溃,需要使用try-catch来进行错误处理,避免影响用户体验。

json 文件

JSON 在小程序中用于配置页面属性和数据源。它可以定义页面的背景色、导航栏字体颜色、数据源等。

分钟带你小程序入门

WXML

WXML 是一种基于 XML 语法的标记语言,用于编写小程序页面结构。它支持数据绑定、条件、循环语句等语法,并可与 JS 模块交互。
分钟带你小程序入门

WXSS

WXSS 是一种基于 CSS 语法的样式表语言,用于定义小程序页面的样式。它支持嵌套、变量、继承、全局样式等特性。
分钟带你小程序入门

写 wxss 时,小程序不支持哪些写法

微信小程序的 WXSS 是一种针对小程序的特殊样式语言,和传统网页CSS有些不同,虽然语法和CSS相似,但在实际使用中还是有一些差别。
下面是不支持的CSS属性和选择器:

CSS属性:

  1. 通用选择器(*)
  2. 边框圆角属性(border-radius)
  3. 文字阴影属性(text-shadow)
  4. 图片滤镜属性(filter)
  5. 高级定位属性(z-index)
  6. grayscale,sepia,saturate,hue-rotate,invert,opacity

CSS选择器:

  1. ID选择器(#id)
  2. 兄弟选择器(+ 和 ~)
  3. 属性选择器中用多个属性一起选择的方式,([attr2=”value2″])
  4. 伪元素选择器(::before和::after)
  5. 可为空元素选择器(:empty)

项目配置

分钟带你小程序入门

调试工具

分钟带你小程序入门

语法回顾

wxml 语法

分钟带你小程序入门

定义模块

直接创建 .wxs 文件 。
每个 wxs 模块均有一个内置的 module 对象。

  • exports: 通过该属性,可以对外共享本模块的私有变量与函数。

路由API 整理

分钟带你小程序入门

持续更新中…….

原文链接:https://juejin.cn/post/7220220100384342074 作者:程序员海军

(0)
上一篇 2023年4月10日 上午10:05
下一篇 2023年4月10日 上午10:17

相关推荐

发表回复

登录后才能评论