## 创建自定义组件 **1、新建 组件.vue 文件** **2、组件文档结构** ``` ` ``` ## 使用组件 ### 1、引用组件 import 组件名称 from "../../components/组件名.vue"; ### 2、注册组件 ``` export default{ components:{ 组件名称 }, } ``` ### 3、在试图模板中使用组件 <组件名称 组件属性="对应的值">

## 完整代码 ``` ```

## 重要说明 因小程序和app登录接口不同，需要在前端进行跨端兼容处理！ ## 小程序端必须的配置 小程序端必须配置 app id（申请小程序开发者并获取 appid 及相关秘钥，支持个人开发者）。获取appid后编辑 manifest.json : ``` "mp-weixin" : { "appid" : "您的app id" } ``` ### 接口地址 https://developers.weixin.qq.com/miniprogram/dev/api/open.html#wxgetuserinfoobject ### app 端必须的配置 app 端支持微信、qq、微博等多种登录方式，都需要申请对应的开发者并获取对应的 appid。获取对应的appid后打开 manifest 可视化操作填写即可： ### 是否登录判断（App.vue） ``` global.isLogin = function(){ try{ var suid = uni.getStorageSync('suid'); var srand = uni.getStorageSync('srand'); }catch(e){ //TODO handle the exception } if(suid == '' || srand == ''){ return false; }else{ return [suid, srand]; } }; ``` ### 需要登录的页面判断 ``` var res = global.isLogin(); if(!res){ uni.showModal({ title:'请登录', content:"请登录", success:function(){ uni.navigateTo({ url:"/pages/login" }); } }) } ``` ## 登录页面开发 ``` ```

## 完整代码 ``` ```

## onPullDownRefresh 在 js 中定义 onPullDownRefresh 处理函数（和onLoad等生命周期函数同级），监听该页面用户下拉刷新事件。 需要在 pages.json 里，找到的当前页面的pages节点，并在 style 选项中开启 enablePullDownRefresh 当处理完数据刷新后，uni.stopPullDownRefresh 可以停止当前页面的下拉刷新。 ### uni.startPullDownRefresh(OBJECT) 开始下拉刷新，调用后触发下拉刷新动画，效果与用户手动下拉刷新一致。 ``` 参数名 类型 必填 说明 success Function 否 接口调用成功的回调 fail Function 否 接口调用失败的回调函数 complete Function 否 接口调用结束的回调函数（调用成功、失败都会执行） ``` ### uni.stopPullDownRefresh() 停止当前页面下拉刷新。 ### 完整演示 page.json 开启下拉刷新 ``` { "pages": [ { "path": "pages/index/index", "style": { "navigationBarTitleText": "hi uni", "enablePullDownRefresh": true } }, ....... ``` ### index.vue ``` ```

## 导航 ``` uni.navigateTo uni.redirectTo uni.reLaunch uni.switchTab uni.navigateBack ``` **手册地址** http://uniapp.dcloud.io/api/ui/navigate?id=navigateback

## 设置导航条 ``` uni.setNavigationBarTitle uni.showNavigationBarLoading uni.hideNavigationBarLoading uni.setNavigationBarColor ``` **手册地址** http://uniapp.dcloud.io/api/ui/navigationbar

## 包含以下内容 ``` uni.showToast uni.showLoading uni.hideToast uni.hideLoading uni.showModal uni.showActionSheet ``` **手册地址** http://uniapp.dcloud.io/api/system/info

## 本节课程包含以下信息： ``` 1、系统信息 2、网络状态 3、加速度计 4、拨打电话 5、剪贴板 6、屏幕亮度 7、振动 ``` **api 手册地址** http://uniapp.dcloud.io/api/system/info

## uni.setStorage(OBJECT) 将数据存储在本地缓存中指定的 key 中，会覆盖掉原来该 key 对应的内容，这是一个异步接口。 ### OBJECT 参数说明 ``` 参数名 类型 必填 说明 key String 是 本地缓存中的指定的 key data Object/String 是 需要存储的内容 success Function 否 接口调用成功的回调函数 fail Function 否 接口调用失败的回调函数 complete Function 否 接口调用结束的回调函数（调用成功、失败都会执行） 示例 ``` ``` uni.setStorage({ key: 'storage_key', data: 'hello', success: function () { console.log('success'); } }); ``` ## uni.setStorageSync(KEY,DATA) 将 data 存储在本地缓存中指定的 key 中，会覆盖掉原来该 key 对应的内容，这是一个同步接口。 **参数说明** ``` 参数 类型 必填 说明 key String 是 本地缓存中的指定的 key data Object/String 是 需要存储的内容 ``` ``` try { uni.setStorageSync('storage_key', 'hello'); } catch (e) { // error } ``` ## uni.getStorage(OBJECT) 从本地缓存中异步获取指定 key 对应的内容。 **OBJECT 参数说明** ``` 参数名 类型 必填 说明 key String 是 本地缓存中的指定的 key success Function 是 接口调用的回调函数，res = {data: key对应的内容} fail Function 否 接口调用失败的回调函数 complete Function 否 接口调用结束的回调函数（调用成功、失败都会执行） ``` **success 返回参数说明** ``` 参数 类型 说明 data String key 对应的内容 ``` **示例** ``` uni.getStorage({ key: 'storage_key', success: function (res) { console.log(res.data); } }); ``` ## uni.getStorageSync(KEY) 从本地缓存中同步获取指定 key 对应的内容。 **参数说明** `参数 类型 必填 说明 key String 是 本地缓存中的指定的 key` **示例** ``` try { const value = uni.getStorageSync('storage_key'); if (value) { console.log(value); } } catch (e) { // error } ``` ## uni.getStorageInfo(OBJECT) 异步获取当前 storage 的相关信息。 OBJECT 参数说明 ``` 参数名 类型 必填 说明 success Function 是 接口调用的回调函数，详见返回参数说明 fail Function 否 接口调用失败的回调函数 complete Function 否 接口调用结束的回调函数（调用成功、失败都会执行） ``` success 返回参数说明 参数 类型 说明 keys String Array 当前 storage 中所有的 key currentSize Number 当前占用的空间大小, 单位：kb limitSize Number 限制的空间大小, 单位：kb **示例** ``` uni.getStorageInfo({ success: function (res) { console.log(res.keys); console.log(res.currentSize); console.log(res.limitSize); } }); ``` ## uni.getStorageInfoSync()** 同步获取当前 storage 的相关信息。 示例 ``` try { const res = uni.getStorageInfoSync(); console.log(res.keys); console.log(res.currentSize); console.log(res.limitSize); } catch (e) { // error } ``` ## uni.removeStorage(OBJECT) 从本地缓存中异步移除指定 key。 **OBJECT 参数说明** ``` 参数名 类型 必填 说明 key String 是 本地缓存中的指定的 key success Function 是 接口调用的回调函数 fail Function 否 接口调用失败的回调函数 complete Function 否 接口调用结束的回调函数（调用成功、失败都会执行） ``` **示例** ``` uni.removeStorage({ key: 'storage_key', success: function (res) { console.log('success'); } }); ``` ## uni.removeStorageSync(KEY) 从本地缓存中同步移除指定 key。 **参数说明** ``` 参数名 类型 必填 说明 key String 是 本地缓存中的指定的 key ``` **示例** ``` try { uni.removeStorageSync('storage_key'); } catch (e) { // error } ``` ## uni.clearStorage() 清理本地数据缓存。 示例 `uni.clearStorage();` ## uni.clearStorageSync() 同步清空本地数据缓存。 示例 ``` try { uni.clearStorageSync(); } catch (e) { // error } ```

## uni.uploadFile(OBJECT) 将本地资源上传到开发者服务器，客户端发起一个 POST 请求，其中 content-type 为 multipart/form-data。 如页面通过 uni.chooseImage 等接口获取到一个本地资源的临时文件路径后，可通过此接口将本地资源上传到指定服务器。 **OBJECT 参数说明** ``` 参数名 类型 必填 说明 平台支持 url String 是 开发者服务器 url files Aarry 否 需要上传的文件列表。使用 files 时，filePath 和 name 不生效。 5+App filePath String 是 要上传文件资源的路径。 name String 是 文件对应的 key , 开发者在服务器端通过这个 key 可以获取到文件二进制内容 header Object 否 HTTP 请求 Header, header 中不能设置 Referer formData Object 否 HTTP 请求中其他额外的 form data success Function 否 接口调用成功的回调函数 fail Function 否 接口调用失败的回调函数 complete Function 否 接口调用结束的回调函数（调用成功、失败都会执行） ``` **files参数说明 ** ``` files 参数是一个 file 对象的数组，file 对象的结构如下： name String 否 multipart 提交时，表单的项目名，默认为 file uri String 是 文件的本地地址 ``` **success 返回参数说明** ``` 参数 类型 说明 data String 开发者服务器返回的数据 statusCode Number 开发者服务器返回的 HTTP 状态码 ``` **返回值** 返回一个 uploadTask 对象，通过 uploadTask，可监听上传进度变化事件，以及取消上传任务。 ### uploadTask 对象的方法列表 ``` onProgressUpdate callback 监听上传进度变化 abort 中断上传任务 onProgressUpdate 返回参数说明 ``` ``` 参数 类型 说明 progress Number 上传进度百分比 totalBytesSent Number 已经上传的数据长度，单位 Bytes totalBytesExpectedToSend Number 预期需要上传的数据总长度，单位 Bytes ``` **实战：选择一个照片上传（带进度条）** ``` ``` **后端文件接收代码（php 版）** ``` getExeName($_FILES['file']['name']); if($exename != 'png' && $exename != 'jpg' && $exename != 'gif'){ exit('不允许的扩展名'); } $imageSavePath = uniqid().'.'.$exename; if(move_uploaded_file($_FILES['file']['tmp_name'], $imageSavePath)){ echo $imageSavePath; } } } public function getExeName($fileName){ $pathinfo = pathinfo($fileName); return strtolower($pathinfo['extension']); } } ```

uni.chooseImage(OBJECT) 从本地相册选择图片或使用相机拍照。 count Number 否 最多可以选择的图片张数，默认9 sizeType StringArray 否 original 原图，compressed 压缩图，默认二者都有 sourceType StringArray 否 album 从相册选图，camera 使用相机，默认二者都有 success Function 是 成功则返回图片的本地文件路径列表 tempFilePaths fail Function 否 接口调用失败的回调函数 complete Function 否 接口调用结束的回调函数（调用成功、失败都会执行） 注：文件的临时路径，在应用本次启动期间可以正常使用，如需持久保存，需在主动调用 uni.saveFile，在应用下次启动时才能访问得到。 success 返回参数说明 参数 类型 说明 tempFilePaths StringArray 图片的本地文件路径列表 tempFiles ObjectArray 图片的本地文件列表，每一项是一个 File 对象 File 对象结构如下 path String 本地文件路径 size Number 本地文件大小，单位：B 示例 uni.chooseImage({ count: 6, //默认9 sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有 sourceType: ['album'], //从相册选择 success: function (res) { console.log(JSON.stringify(res.tempFilePaths)); } }); uni.previewImage(OBJECT) 预览图片 OBJECT 参数说明 current String 否 当前显示图片的链接，不填则默认为 urls 的第一张 urls StringArray 是 需要预览的图片链接列表 success Function 否 接口调用成功的回调函数 fail Function 否 接口调用失败的回调函数 complete Function 否 接口调用结束的回调函数（调用成功、失败都会执行） 示例 uni.chooseImage({ count: 6, sizeType: ['original', 'compressed'], sourceType: ['album'], success: function (res) { // 预览图片 uni.previewImage({ urls: res.tempFilePaths }); } }); uni.getImageInfo(OBJECT) 获取图片信息 OBJECT 参数说明 参数名 类型 必填 说明 src String 是 图片的路径，可以是相对路径，临时文件路径，存储文件路径，网络图片路径 success Function 否 接口调用成功的回调函数 fail Function 否 接口调用失败的回调函数 complete Function 否 接口调用结束的回调函数（调用成功、失败都会执行） success 返回参数说明 参数名 类型 说明 最低版本 width Number 图片宽度，单位px * height Number 图片高度，单位px * path String 返回图片的本地路径 * orientation String 返回图片的方向，有效值见下表 * type String 返回图片的格式 * orientation 参数说明 枚举值 说明 up 默认 down 180度旋转 left 逆时针旋转90度 right 顺时针旋转90度 up-mirrored 同up，但水平翻转 down-mirrored 同down，但水平翻转 left-mirrored 同left，但垂直翻转 right-mirrored 同right，但垂直翻转 示例 uni.chooseImage({ count: 1, sourceType: ['album'], success: function (res) { uni.getImageInfo({ src: res.tempFilePaths[0], success: function (image) { console.log(image.width); console.log(image.height); } }); } }); uni.saveImageToPhotosAlbum(OBJECT) 保存图片到系统相册 参数名 类型 必填 说明 filePath String 是 图片文件路径，可以是临时文件路径也可以是永久文件路径，不支持网络图片路径 success Function 否 接口调用成功的回调函数 fail Function 否 接口调用失败的回调函数 complete Function 否 接口调用结束的回调函数（调用成功、失败都会执行） success 返回参数说明 参数名 类型 说明 errMsg String 调用结果 示例代码： uni.chooseImage({ count: 1, sourceType: ['camera'], success: function (res) { uni.saveImageToPhotosAlbum({ filePath: res.tempFilePaths[0], success: function () { console.log('save success'); } }); } });

## 1、 uni.request(OBJECT) 发起网络请求 ``` 参数名 类型 必填 默认值 说明 url String 是 开发者服务器接口地址 data Object/String/ArrayBuffer 否 请求的参数 header Object 否 设置请求的 header，header 中不能设置 Referer。 method String 否 GET （需大写）有效值：OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT dataType String 否 json 如果设为 json，会尝试对返回的数据做一次 JSON.parse responseType String 否 text 设置响应的数据类型。合法值：text、arraybuffer success Function 否 收到开发者服务成功返回的回调函数 fail Function 否 接口调用失败的回调函数 complete Function 否 接口调用结束的回调函数（调用成功、失败都会执行） ``` **success 返回参数说明** ``` 参数 类型 说明 data Object/String/ArrayBuffer 开发者服务器返回的数据 statusCode Number 开发者服务器返回的 HTTP 状态码 header Object 开发者服务器返回的 HTTP Response Header ``` **data 数据说明** 最终发送给服务器的数据是 String 类型，如果传入的 data 不是 String 类型，会被转换成 String。转换规则如下： ``` 对于 GET 方法，会将数据转换为 query string。例如 { name: 'name', age: 18 } 转换后的结果是 name=name&age=18。 对于 POST 方法且 header['content-type'] 为 application/json 的数据，会进行 JSON 序列化。 对于 POST 方法且 header['content-type'] 为 application/x-www-form-urlencoded 的数据，会将数据转换为 query string。 ``` **示例：** ``` ```

## map 地图 ``` 属性名 类型 默认值 说明 平台支持 longitude Number 中心经度 latitude Number 中心纬度 scale Number 16 缩放级别，取值范围为5-18 markers Array 标记点 covers Array 即将移除，请使用 markers polyline Array 路线 circles Array 圆 controls Array 控件 include-points Array 缩放视野以包含所有给定的坐标点 show-location Boolean 显示带有方向的当前定位点 @markertap EventHandle 点击标记点时触发 @callouttap EventHandle 点击标记点对应的气泡时触发 微信小程序、5+App @controltap EventHandle 点击控件时触发 @regionchange EventHandle 视野发生变化时触发 @tap EventHandle 点击地图时触发 @updated EventHandle 在地图渲染更新完成时触发 微信小程序 ``` 注意: covers 属性即将移除，请使用 markers 替代 uniapp只支持gcj02坐标 **markers** 标记点用于在地图上显示标记的位置 ``` 属性 说明 类型 必填 备注 平台支持 id 标记点id Number 否 marker点击事件回调会返回此id。建议为每个marker设置上Number类型id，保证更新marker时有更好的性能。 latitude 纬度 Number 是 浮点数，范围 -90 ~ 90 longitude 经度 Number 是 浮点数，范围 -180 ~ 180 title 标注点名 String 否 iconPath 显示的图标 String 是 项目目录下的图片路径，支持相对路径写法，以'/'开头则表示相对小程序根目录；也支持临时路径 rotate 旋转角度 Number 否 顺时针旋转的角度，范围 0 ~ 360，默认为 0 alpha 标注的透明度 Number 否 默认1，无透明，范围 0 ~ 1 width 标注图标宽度 Number 否 默认为图片实际宽度 height 标注图标高度 Number 否 默认为图片实际高度 callout 自定义标记点上方的气泡窗口 Object 否 支持的属性见下表，可识别换行符。 微信小程序、5+App label 为标记点旁边增加标签 Object 否 支持的属性见下表，可识别换行符。 微信小程序、5+App anchor 经纬度在标注图标的锚点，默认底边中点 Object 否 {x, y}，x表示横向(0-1)，y表示竖向(0-1)。{x: .5, y: 1} 表示底边中点 微信小程序、5+App ``` **marker 上的气泡 callout** ``` 属性 说明 类型 平台支持 content 文本 String 微信小程序、5+App color 文本颜色 String 微信小程序、5+App fontSize 文字大小 Number 微信小程序、5+App borderRadius callout边框圆角 Number 微信小程序、5+App bgColor 背景色 String 微信小程序、5+App padding 文本边缘留白 Number 微信小程序、5+App display 'BYCLICK':点击显示; 'ALWAYS':常显 String 微信小程序、5+App textAlign 文本对齐方式。有效值: left, right, center String 微信小程序、5+App ``` **marker 上的气泡 label** ``` 属性 说明 类型 平台支持 content 文本 String 微信小程序、5+App color 文本颜色 String 微信小程序、5+App fontSize 文字大小 Number 微信小程序、5+App x label的坐标，原点是 marker 对应的经纬度 Number 微信小程序、5+App y label的坐标，原点是 marker 对应的经纬度 Number 微信小程序、5+App borderWidth 边框宽度 Number 微信小程序、5+App borderColor 边框颜色 String 微信小程序、5+App borderRadius 边框圆角 Number 微信小程序、5+App bgColor 背景色 String 微信小程序、5+App padding 文本边缘留白 Number 微信小程序、5+App textAlign 文本对齐方式。有效值: left, right, center String 微信小程序、5+App ``` **polyline** 指定一系列坐标点，从数组第一项连线至最后一项 ``` 属性 说明 类型 必填 备注 平台支持 points 经纬度数组 Array 是 [{latitude: 0, longitude: 0}] color 线的颜色 String 否 8位十六进制表示，后两位表示alpha值，如：#000000AA width 线的宽度 Number 否 dottedLine 是否虚线 Boolean 否 默认false arrowLine 带箭头的线 Boolean 否 默认false，开发者工具暂不支持该属性 微信小程序、5+App arrowIconPath 更换箭头图标 String 否 在arrowLine为true时生效 微信小程序、5+App borderColor 线的边框颜色 String 否 微信小程序、5+App borderWidth 线的厚度 Number 否 微信小程序、5+App ``` **circles** 在地图上显示圆 ``` 属性 说明 类型 必填 备注 latitude 纬度 Number 是 浮点数，范围 -90 ~ 90 longitude 经度 Number 是 浮点数，范围 -180 ~ 180 color 描边的颜色 String 否 8位十六进制表示，后两位表示alpha值，如：#000000AA fillColor 填充颜色 String 否 8位十六进制表示，后两位表示alpha值，如：#000000AA radius 半径 Number 是 strokeWidth 描边的宽度 Number 否 ``` **controls** 在地图上显示控件，控件不随着地图移动 ``` 属性 说明 类型 必填 备注 id 控件id Number 否 在控件点击事件回调会返回此id position 控件在地图的位置 Object 是 控件相对地图位置 iconPath 显示的图标 String 是 项目目录下的图片路径，支持相对路径写法，以'/'开头则表示相对小程序根目录；也支持临时路径 clickable 是否可点击 Boolean 否 默认不可点击 ``` **position** ``` 属性 说明 类型 必填 备注 left 距离地图的左边界多远 Number 否 默认为0 top 距离地图的上边界多远 Number 否 默认为0 width 控件宽度 Number 否 默认为图片宽度 height 控件高度 Number 否 默认为图片高度 ``` 地图组件的经纬度必填, 如果不填经纬度则默认值是北京的经纬度。 **示例：** ``` export default { data() { return { title: 'map', latitude: 39.909, longitude: 116.39742, markers: [{ width : 40, height: 40, latitude: 39.909, longitude: 116.39742, iconPath: '../../../static/p.png' }] } }, methods: { } } ```

## image 图片 **属性名** ``` 类型 默认值 说明 平台支持 src String 图片资源地址 mode String 'scaleToFill' 图片裁剪、缩放的模式 lazy-load Boolean false 图片懒加载。只针对page与scroll-view下的image有效 微信小程序 @error HandleEvent 当错误发生时，发布到 AppService 的事件名，事件对象event.detail = {errMsg: 'something wrong'} @load HandleEvent 当图片载入完毕时，发布到 AppService 的事件名，事件对象event.detail = {height:'图片高度px', width:'图片宽度px'} 注：image组件默认宽度300px、高度225px ``` mode 有效值： mode 有 13 种模式，其中 4 种是缩放模式，9 种是裁剪模式。 **模式 值 说明** ``` 缩放 scaleToFill 不保持纵横比缩放图片，使图片的宽高完全拉伸至填满 image 元素 缩放 aspectFit 保持纵横比缩放图片，使图片的长边能完全显示出来。也就是说，可以完整地将图片显示出来。 缩放 aspectFill 保持纵横比缩放图片，只保证图片的短边能完全显示出来。也就是说，图片通常只在水平或垂直方向是完整的，另一个方向将会发生截取。 缩放 widthFix 宽度不变，高度自动变化，保持原图宽高比不变 裁剪 top 不缩放图片，只显示图片的顶部区域 裁剪 bottom 不缩放图片，只显示图片的底部区域 裁剪 center 不缩放图片，只显示图片的中间区域 裁剪 left 不缩放图片，只显示图片的左边区域 裁剪 right 不缩放图片，只显示图片的右边区域 裁剪 top left 不缩放图片，只显示图片的左上边区域 裁剪 top right 不缩放图片，只显示图片的右上边区域 裁剪 bottom left 不缩放图片，只显示图片的左下边区域 裁剪 bottom right 不缩放图片，只显示图片的右下边区域 ``` 说明： 图片支持远程路径。 ## audio 音频 **属性名 类型 默认值 说明** ``` id String audio 组件的唯一标识符 src String 要播放音频的资源地址 loop Boolean false 是否循环播放 controls Boolean false 是否显示默认控件 poster String 默认控件上的音频封面的图片资源地址，如果 controls 属性值为 false 则设置 poster 无效 name String 未知音频 默认控件上的音频名字，如果 controls 属性值为 false 则设置 name 无效 author String 未知作者 默认控件上的作者名字，如果 controls 属性值为 false 则设置 author 无效 binderror EventHandle 当发生错误时触发 error 事件，detail = {errMsg: MediaError.code} bindplay EventHandle 当开始/继续播放时触发play事件 bindpause EventHandle 当暂停播放时触发 pause 事件 bindtimeupdate EventHandle 当播放进度改变时触发 timeupdate 事件，detail = {currentTime, duration} bindended EventHandle 当播放到末尾时触发 ended 事件 MediaError.code ``` **返回错误码 描述** ``` 1 获取资源被用户禁止 2 网络错误 3 解码错误 4 不合适资源 ``` **示例：** ``` export default { data() { return { title: 'audio', current: { poster: 'https://img-cdn-qiniu.dcloud.net.cn/uniapp/audio/music.jpg', name: '致爱丽丝', author: '暂无', src: 'https://img-cdn-qiniu.dcloud.net.cn/uniapp/audio/music.mp3', }, audioAction: { method: 'pause' } } } } ```

## navigator **属性名 ** ``` 类型 默认值 说明 平台支持 url String 应用内的跳转链接，值为相对路径或绝对路径，如："../first/first"，"/pages/first/first"，注意不能加 .vue 后缀 open-type String navigate 跳转方式 delta Number 当 open-type 为 'navigateBack' 时有效，表示回退的层数 hover-class String navigator-hover 指定点击时的样式类，当hover-class="none"时，没有点击态效果 hover-stop-propagation Boolean false 指定是否阻止本节点的祖先节点出现点击态 微信小程序 hover-start-time Number 50 按住后多久出现点击态，单位毫秒 hover-stay-time Number 600 手指松开后点击态保留时间，单位毫秒 open-type 有效值： ``` ## ## 值 说明 平台支持 ``` navigate 对应 uni.navigateTo 的功能 redirect 对应 uni.redirectTo 的功能 switchTab 对应 uni.switchTab 的功能 reLaunch 对应 uni.reLaunch 的功能 微信小程序 navigateBack 对应 uni.navigateBack 的功能 微信小程序 ``` 注：navigator-hover 默认为 {background-color: rgba(0, 0, 0, 0.1); opacity: 0.7;}, 的子节点背景色应为透明色。 示例： ``` export default { data() { return { title: 'navigator' } }, methods: { } } ``` 页面传值及接收 index/index.vue test.vue 接收参数

文档链接 http://uniapp.dcloud.io/component/button 概述 包含表单及常用表单元素的知识点讲解。 包含以下组件的讲解 button、checkbox、form、input、label、picker、radio、slider、switch、textarea

## 相关文档 http://uniapp.dcloud.io/component/README 框架为开发者提供了一系列基础组件，开发者可以通过组合这些基础组件进行快速开发。 ## 什么是组件： ** 组件是视图层的基本组成单元**。 一个组件通常包括开始标签和结束标签，属性用来修饰这个组件，内容在两个标签之内。 ``` ``` **Tips** 所有组件与属性名都是小写，单词之间以连字符-连接。 根节点为