uni-api图片上传和预览

一 点睛

1 官网： http://uniapp.dcloud.io/api/media/image

2 核心API

• uni.chooseImage(OBJECT)
• uni.previewImage(OBJECT)

二 代码

1 新建 photo.vue

2 修改路由 pages.json

{
	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
		{
			"path": "pages/photo/photo"
		},
		{
			"path": "pages/list/list",
			"style":{
				"enablePullDownRefresh": true,
				"onReachBottomDistance":200
			}
		},
		{
			"path": "pages/index/index"
		},
		{
			"path":"pages/home/home"
		},
		{
			"path": "pages/uni-style/uni-style"
		},
		{
			"path": "pages/message/message",
			"style":{
				"navigationBarTitleText":"信息页",
				"navigationBarBackgroundColor":"#007AFF",
				"h5":{
					"pullToRefresh":{
						"color":"#7D26CD"
					}
				}
			}
		},
		{
			"path": "pages/contact/contact"
		},
		{
			"path": "pages/detail/detail"
		}
	],
	"globalStyle": {
		"navigationBarTextStyle": "white",
		"navigationBarTitleText": "绿帽子",
		"navigationBarBackgroundColor": "#7FFF00",
		"backgroundColor": "#7CCD7C",
		"backgroundTextStyle":"light"
	},
	"tabBar":{
		"color":"#F0AD4E",
		"selectedColor":"#4CD964",
		"backgroundColor":"#007AFF",
		"borderStyle":"black",
		"list":[
			{
				"text":"首页",
				"pagePath":"pages/index/index",
				"iconPath":"static/tabs/1237644.png",
				"selectedIconPath":"static/tabs/1237719.png"
			},
			{
				"text":"信息页",
				"pagePath":"pages/message/message",
				"iconPath":"static/tabs/1246271.png",
				"selectedIconPath":"static/tabs/1262419.png"
			},
			{
				"text":"我们",
				"pagePath":"pages/contact/contact",
				"iconPath":"static/tabs/1262419.png",
				"selectedIconPath":"static/tabs/1289167.png"
			}
		]
	},
	"condition":{
		"current":0,
		"list":[
			{
				"name":"详情页",
				"path":"pages/detail/detail",
				"query":"id=80"
			}
		]
	}
}

三 效果