微信小程序（基础）

文档官网：https://developers.weixin.qq.com/miniprogram

https://developers.weixin.qq.com/miniprogram/dev/framework

https://mp.weixin.qq.com

https://www.leiphone.com

http://test.dscmall.cn

https://www.iconfont.cn/

命名规则：驼峰命名

导航标题字体颜色：只有黑色和白色两种

小程序没有wxml和wxss可以做的

小程序里面的标签很少，view，image,text,block(没有任何作用，可以做一些循环和语法，不添加内容),超链接

中括号：数组

大括号：对象

view标签类似于div

单位rpx,200rpx=100px

text文本标签类似于span、p、h1-h6等标签

image图片标签，用来插入图片。

超链接标签：<navigator href=”” open-type=”switchTab”>超链接</navigator>

（如果在全局变量中定义了tabBar之后超链接就要用open-type=”switchTab”清除一下样式）

block标签不会在页面中渲染，只接受控制属性，类似于for循环之类的

自定义属性数组：

js：

wx:for-tem=””  wx:for-index=”key”

wxml:

            

数组对象：js:

                       

wxml:

                

属性绑定：我们自己定义的属性必须价格前缀-

data-aid=”{{}}”

js:

wxml:

              

二级数组：wxml:

js:

单击事件：

按钮：

                  

size=”mini”  //定义按钮的大小

type=”warn” //定义按钮背景色为红色

plain=”true” //定义按钮是否镂空

disabled=“true”//定义按钮是否禁用

loading=“loading” //按钮等待

bindtap=”fn”      //绑定的函数名

  函数fn:

                

wxml:

                  

getMsg:

js:

data:

wxml:

setMsg:

js:

wxml:

 

冒泡机制：

事件冒泡：当一个节点接收到一个事件，会逐层向外传递，直到最顶层位置，这种触发机制成为冒泡机制

阻止事件冒泡：catchtap：

跳转函数：js:

wxml:

wxml内容：                          js值

轮播图： 滑动组件：标签<swiper></swiper>

indicator-dots=”{{indicatorDots}}”     //下边出现指示点    true

autoplay=”{{autoplay}}”            //是否自动播放      true

interval=”{{interval}}”             //轮播时间间隔      时间

circular=“{{circular}}”           //是否衔接播放       true

duration=”{{duration}}”          //翻页的播放时长      时间

indicator-active-color =“#f00”  //指示点的颜色

转接电话功能

tel(){

wx.makePhoneCall({

phoneNumber:’1654646465’,

})

}

滑动容器：

white-space：nowrap;//设置如何处理元素的空白，设置元素不换行

图标：<icon type=”success” size=”40-70” color=””></icon>

type=”success” //设置图标样式

size=”40-70”  //设置图标大小

color=””     //设置图标颜色

值：

地图：

longitude=””       //经度

latitude=””       //纬度

scale=””         //地图缩放比例

js：定义定位图标的位置和大小：

clickable:true   //触发事件

title：’’       //标题

rotate：      //旋转   定义自己所在的位置：

callout:{

content:””   //添加内容

color：””   //

fontsize:””

borderRadius:””

borderWidth:””

}

设置区域的文本描述：

js: 定义起始路线：ploylines:[{

points:[{

longitude:””

latitude:””

},

 {

                       longitude:””,,

                       latitude:””},

                      {

longitude:””

latitude:””}

}]

}]

wxml:

导入音频：audio

poster=“{{poster}}”   //定义封面图片

name=“{{name}}”    //歌名

author=“{{author}}”  //定义歌手名

src=”{{}}”

设置摄像功能：camera

device-position=”back”   //后置摄像头  front-前置

flash=”off”            //关闭闪光灯   on打开

js:设置拍照函数

quality：””;   //设置相机像素的质量

success：(res)=>{this.setData({src.res.tempImagePath})}   //照片文件的临时路径

wxml:

录制视频：

js： start函数：

stop函数：

wxml：