微信小程序基础开发

基本概念:
语法结构入门:
1.WXML讲解:
(1)数据绑定: WXML 通过 { {变量名}} 来绑定 WXML 文件和对应的 JavaScript 文件中的 data 对象属性。
(2)条件逻辑: WXML 中,使用 wx:if="{ {condition}}" 来判断是否需要渲染该代码块:
(3)列表渲染: 在组件上使用 wx:for 控制属性绑定一个数组,即可使用数组中各项的数据重复渲染该组件。默认数组的当前项的下标变量名默认为 index,数组当前项的变量名默认为 item
(4)模板: WXML提供模板(template),可以在模板中定义代码片段,然后在不同的地方调用。
使用 is 属性,声明需要的使用的模板,然后将模板所需要的 data 传入
(5)引用: WXML 提供两种文件引用方式import和include。
import 可以在该文件中使用目标文件定义的 template; import 有作用域的概念,即只会 import 目标文件中定义的 template,而不会 import 目标文件中 import 的 template,简言之就是 import 不具有递归的特性。
include 可以将目标文件中除了 <template/> <wxs/> 外的整个代码引入,相当于是拷贝到 include 位置
2.WXSS讲解:
(1) 支持动态更新样式:
<!--index.wxml-->
<!--可动态变化的内联样式-->
<!--
{
  eleColor: 'red',
  eleFontsize: '48rpx'
}
-->
<view style="color: { {eleColor}}; font-size: { {eleFontsize}}"></view>
(2)选择器:
3.JS文件讲解;
(1) 脚本执行顺序: 小程序的执行的入口文件是 app.js 。并且会根据其中 require 的模块顺序决定文件的运行顺序
当 app.js 执行结束后,小程序会按照开发者在 app.json 中定义的 pages 的顺序,逐一执行。
(2)作用域:
全局变量: 当需要使用全局变量的时,通过使用全局函数 getApp() 获取全局的实例,并设置相关属性值,来达到设置全局变量的目的
app.js中设置全局变量:

猜你喜欢

转载自blog.csdn.net/woshiyuyanjia/article/details/134885342