怪兽充电小程序

article/2025/5/14 21:12:32

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
第一首先看中心点上有个小图标
实现方式，我们可以使用map 结合一个图片覆盖物实现，在结合定位

   <map id="myMap" show-locationenable-poienable-building :latitude="latitude":longitude="longitude":markers="markers"@regionchange="anchorpointtapmap"><cover-image class="img-map" src="../../static/mark.png" >  </cover-image></map>

#myMap {width: 100%;height: 100%;position: relative;}.img-map {width: 54rpx;height:80rpx;position: absolute;left: calc(50% - 0rpx);top: calc(50% - 40rpx);transform: translate(-50%,-50%); }.coview{position: absolute;bottom: 0px;width: 100%;height: 50px;background: red;}

当我们拖动的时候，点击刷新按钮让中心小图标回来
实现思路，当我们第一获取当前位置的时候，存储一个当前坐标
在移动回来
在data中定义两个字段

deflatitude:"",
deflongitude:"",

  <cover-view class="backcenter"  @click="backcenter()"><cover-image style="width: 40px; height: 25px;margin: 8px 0px;"   src="../../static/sx.png" ></cover-image ></cover-view> 

	backcenter(){this.$nextTick(() => {const mapCtx = wx.createMapContext("myMap",this);mapCtx.moveToLocation({latitude:this.deflatitude,longitude:this.deflongitude,success:() => {},});})},

在
mounted() {this.onAuthLocation();}

    onAuthLocation() {var that =this;uni.getLocation({type: 'gcj02',altitude:true,isHighAccuracy:true,success: function (res) {that.latitude =res.latitude;that.longitude =res.longitude;that.deflatitude =res.latitude;that.deflongitude =res.longitude;}});},

充电宝小图标标注只要使用markers
在拖动地图的获取到对应坐标。后台返回当前坐标附近有充电宝的数组，赋值给markers 这里只做死数据演示。
完整代码
在这里插入图片描述
使用uni-app创建项目

pages.json

{"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages{"path": "pages/index/index","style": {"navigationBarTitleText": "怪兽充电"}},{"path" : "pages/nearshop/nearshop","style" :                                                                                    {"navigationBarTitleText": "附近门店","enablePullDownRefresh": false}},{"path" : "pages/user/user","style" :                                                                                    {"navigationBarTitleText": "个人中心","enablePullDownRefresh": false,"navigationStyle":"custom","app-plus":{"titleView":false}}}],"globalStyle": {"navigationBarTextStyle": "black","navigationBarTitleText": "怪兽充电","navigationBarBackgroundColor": "#F8F8F8","backgroundColor": "#F8F8F8"}
}
index.vue

<template><view class="page"><view class="page-body"><map id="myMap" show-locationenable-poienable-building :latitude="latitude":longitude="longitude":markers="markers"@regionchange="anchorpointtapmap"><cover-image class="img-map" src="../../static/mark.png" >  </cover-image></map><view class="pop-up"><view class="mian"><view class="item1" @click="gonear(1)"><image style="width: 30px; height: 30px; " :mode="aspectFit"src="../../static/md.png"></image><text>附近门店</text>               </view><view class="item2"><button type="default" @click="scanCode">扫码充电</button></view><view class="item3" @click="gonear(3)"><image style="width: 30px; height: 30px;" :mode="aspectFit" src="../../static/user.png"></image><text>个人中心</text></view></view></view><cover-view class="backcenter"  @click="backcenter()"><cover-image style="width: 40px; height: 25px;margin: 8px 0px;" src="../../static/sx.png"></cover-image ></cover-view> <cover-view class="sercharea" @click="serchArea()"><cover-image style="width: 40px; height: 40px; " src="../../static/serch.png"></cover-image ></cover-view> </view></view>
</template>
<script>export default {data() {return {latitude:"",longitude:"",deflatitude:"",deflongitude:"",markers:[{id:1,latitude:24.969814,longitude:102.657425,iconPath: '../../static/cd.png',width: 40,  height: 40,  },{id:1,latitude: 24.971656,longitude:102.654897,iconPath: '../../static/cd.png',width: 40,height: 40,  },{id:2,latitude:  24.9691,longitude:102.654088,iconPath: '../../static/cd.png',width: 40,height: 40,  },{id:3,latitude:  24.967334,longitude:102.653383,iconPath: '../../static/cd.png',width: 40,height: 40,  },{id:4,latitude: 24.879703775535386,longitude:102.8342279674439,iconPath: '../../static/cd.png',width: 40,height: 40,  },{id:5,latitude: 24.881493693603918,longitude:102.83141852640438,iconPath: '../../static/cd.png',width: 40,height: 40,  },{id:6,latitude: 24.878327580546117,longitude: 102.83307330796902,iconPath: '../../static/cd.png',width: 40,height: 40,  },]}},onShow: function () {},methods: {onAuthLocation() {var that =this;uni.getLocation({type: 'gcj02',altitude:true,isHighAccuracy:true,success: function (res) {that.latitude =res.latitude;that.longitude =res.longitude;that.deflatitude =res.latitude;that.deflongitude =res.longitude;}});},anchorpointtapmap(e){console.log(e)},//扫码scanCode(){uni.scanCode({onlyFromCamera: false,success: function (res) {console.log('条码类型：' + res.scanType);console.log('条码内容：' + res.result);}});},//位置搜索serchArea(){var that =this;uni.chooseLocation({success: function (res) {// console.log('位置名称：' + res.name);// console.log('详细地址：' + res.address);// that.address = res.address;that.latitude=res.latitude;that.longitude=res.longitude;}});},//返回中线点backcenter(){this.$nextTick(() => {const mapCtx = wx.createMapContext("myMap",this);mapCtx.moveToLocation({latitude:this.deflatitude,longitude:this.deflongitude,success:() => {console.log('我移过去了')},});})},gonear(index){if(index==1){uni.navigateTo({url: '/pages/nearshop/nearshop'});}else if(index==3){ uni.navigateTo({url: '/pages/user/user'});}}},mounted() {this.onAuthLocation();}}
</script><style>.page-body{width: 100%;height: 100%;}.page{width: 100%;height: 100%;}#myMap {width: 100%;height: 100%;position: relative;}.img-map {width: 54rpx;height:80rpx;position: absolute;left: calc(50% - 0rpx);top: calc(50% - 40rpx);transform: translate(-50%,-50%); }.coview{position: absolute;bottom: 0px;width: 100%;height: 50px;background: red;}/* 弹出层 */.pop-up{position: fixed;bottom: 0;left: 0;width: 100%;height:90px;background-color:#fff;z-index: 999999; border-top-right-radius: 10px;border-top-left-radius: 10px;}.mian{width: 100%;height: 100%;display: flex;}.item1{width: 100px;height: 100%;display: flex;flex-direction:column;align-items:center;justify-content: center;}.item2{flex: 1;height: 100%;position: relative;}.item2 button{width: 100%;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%); color: #fff;background: #2cd7c7;border-radius: 30rpx;}.item3{width: 100px;height: 100%;display: flex;flex-direction:column;align-items:center;justify-content: center;}.item3 text{font-size: 30rpx;color: #333;padding: 2px;}.item1 text{padding: 2px;font-size: 30rpx;color: #333;}.sercharea{width: 40px;height: 40px;background: #fff;position: fixed;left: 10px;bottom: 110px;border-radius: 100%;}.backcenter{width: 40px;height: 40px;background: #fff;position: fixed;left: 10px;bottom:160px;border-radius: 100%;}</style>
nearshop.vue

<template><view class="nearbox"><view class="vul"><view class="uli" v-for="(item,index) in list" :key='index' @click="selfn(index)":class="{active:index==current}">{{item}}</view></view><view class="viewmain"><view v-if="current==0"><view class="ullist" v-for="(item,index) in datalist" :key='index'><view class="listtop"><view class="listtop_line"><view class="item1"><cover-image class="img" style="width: 80px; height: 80px; ":src="item.pic"></cover-image></view><view class="item2"><text class="txt1">{{item.name}}</text><text class="txt2">{{item.area}}</text><text class="txt3">营业时间:{{item.time}}</text></view><view class="item3">990m</view></view></view><view class="listboot"><view v-if="item.type==1"><text>{{item.info1}}</text> <text>{{item.info2}}</text></view>		<view v-if="item.type==2"><text>{{item.info1}}</text> <text>{{item.info2}}</text><text class="colee5600">{{item.info3}}</text></view>	<view v-if="item.type==3"><text>{{item.info1}}</text> <text class="colee5600">{{item.info3}}</text></view>	</view></view></view><view v-if="current==1"><view class="ullist" v-for="(item,index) in datalist" :key='index'><view class="listtop"><view class="listtop_line"><view class="item1"><cover-image class="img" style="width: 80px; height: 80px; ":src="item.pic"></cover-image></view><view class="item2"><text class="txt1">{{item.name}}</text><text class="txt2">{{item.area}}</text><text class="txt3">营业时间:{{item.time}}</text></view><view class="item3">990m</view></view></view><view class="listboot"><view v-if="item.type==1"><text>{{item.info1}}</text> <text>{{item.info2}}</text></view>		<view v-if="item.type==2"><text>{{item.info1}}</text> <text>{{item.info2}}</text><text class="colee5600">{{item.info3}}</text></view>	<view v-if="item.type==3"><text>{{item.info1}}</text> <text class="colee5600">{{item.info3}}</text></view>	</view></view></view><view v-if="current==2"><view class="ullist" v-for="(item,index) in datalist" :key='index'><view class="listtop"><view class="listtop_line"><view class="item1"><cover-image class="img" style="width: 80px; height: 80px; ":src="item.pic"></cover-image></view><view class="item2"><text class="txt1">{{item.name}}</text><text class="txt2">{{item.area}}</text><text class="txt3">营业时间:{{item.time}}</text></view><view class="item3">990m</view></view></view><view class="listboot"><view v-if="item.type==1"><text>{{item.info1}}</text> <text>{{item.info2}}</text></view>		<view v-if="item.type==2"><text>{{item.info1}}</text> <text>{{item.info2}}</text><text class="colee5600">{{item.info3}}</text></view>	<view v-if="item.type==3"><text>{{item.info1}}</text> <text class="colee5600">{{item.info3}}</text></view>	</view></view></view></view></view>
</template><script>export default {data() {return {current: "0",list: ["全部门店", "可用门店", "可还门店"],datalist:[{pic:"../../static/mendian/1.png",name:"云升会所(西路店)",area:"我二人B2号",time:"09:00-20:00",type:1,info1:'可用',info2:'可还'},{pic:"../../static/mendian/2.png",name:"就撒旦而且我说的",area:"我二人B2号",time:"09:00-20:00",type:2,info1:'可用',info2:'可还',info3:'(即将还满,请尽快前往)'},{pic:"../../static/mendian/3.png",name:"云升会所(我去恩去我恩)",area:"我二人B2号",time:"09:00-20:00",type:2,info1:'可用',info2:'可还',info3:'(即将还满,请尽快前往)'},{pic:"../../static/mendian/4.png",name:"去我恩 (西路店)",area:"我二人B2号",time:"09:00-20:00",type:3,info1:'可用',info2:'可还',info3:'(即将还满,请尽快前往)',info4:'无法归还充电宝，请选择其他门店'},{pic:"../../static/mendian/5.png",name:"说的发生的(我的)",area:"我儿 B2号",time:"09:00-20:00",type:1,info1:'可用',info2:'可还'},{pic:"../../static/mendian/6.png",name:"云升会所(我儿万人)",area:"我二人B2号",time:"09:00-20:00",type:2,info1:'可用',info2:'可还',info3:'(即将还满,请尽快前往)'},{pic:"../../static/mendian/7.png",name:"生栋覆屋(我放)",area:"关金柳露路二期B2号",time:"09:00-20:00",type:3,info1:'可用',info2:'可还',info3:'(即将还满,请尽快前往)',info4:'无法归还充电宝，请选择其他门店'},{pic:"../../static/mendian/8.png",name:"士大夫我师父(任汝芬)",area:"人物而3 B2号",time:"09:00-20:00",type:3,info1:'可用',info2:'可还',info3:'(即将还满,请尽快前往)',info4:'无法归还充电宝，请选择其他门店'}]}},methods: {selfn(index) {this.current = index;if(index==1){this.unlist();}else if(index==2){this.unlist();}},//随机打乱绥组shuffle(a) {var len = a.length;for(var i=0;i<len;i++){var end = len - 1 ;var index = (Math.random()*(end + 1)) >> 0;var t = a[end];a[end] = a[index];a[index] = t;}return a;},unlist(){this.datalist = this.shuffle(this.datalist);}	   }}
</script><style scoped>.nearbox {width: 100%;height: 100%;background: #f4f4f4;}.vul {width: 100%;height: 30px;display: flex;}.uli {flex: 1;text-align: center;line-height: 30px;color: #2CD7C7;font-weight: bold;font-size: 15px;}.active {border-bottom: 2px solid #2CD7C7;}.ullist {width: 95%;height: 130px;margin: 8px auto;background: #fff;border-radius: 8px;}.listtop {width: 100%;height: 100px;}.listboot {width: 100%;height: 30px;font-size: 13px;line-height: 30px;text-indent: 20px;color: #333;}.colee5600{color: #ee5600;}.listboot text{margin: 0 3px;}.listtop .listtop_line {width: 95%;height: 98%;margin: 0 auto;border-bottom: 1px solid #f4f4f4;display: flex;}.listtop_line .item1 {width: 100px;height: 100%;}.listtop_line .item1 .img {margin: 10px;border-radius: 5px;}.listtop_line .item2 {flex: 1;display: flex;flex-direction: column;}.item2 .txt1 {font-size: 15px;color: #333333;line-height: 30px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-weight: bold;}.item2 .txt2 {font-size: 13px;color: #999;line-height: 30px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}.item2 .txt3 {font-size: 13px;color: #666;line-height: 30px;}.listtop_line .item3 {width: 50px;height: 100%;text-align: center;line-height: 98px;color: #999999;font-size: 14px;}
</style>
user.vue

<template><view><view><view class="status_bar"><!-- 这里是状态栏 --></view><view class="userinfo"><view class="userinfotop"></view><view class="infoboot"><view class="left"><cover-image v-if="isauto" class="img" style="width: 80px; height: 80px; ":src="userinfo.avatarUrl"></cover-image><button v-if="!isauto" class='login-btn' @click="bindGetUserInfo"> </button></view><view class="right">{{userinfo.nickName}}</view></view><view class="back"><cover-image @click="goback()" class="img" style="width: 20px; height: 20px;"src="../../static/back.png"></cover-image></view></view><view class="listmain"><view style="margin-top: 20px;"><view class="list"><cover-image class="imgs" style="width: 30px; height: 30px; " src="../../static/a1.png"></cover-image><text class="txt">我的钱包</text><cover-image class="imgs" style="width: 30px; height: 30px; " src="../../static/nest.png"></cover-image></view><view class="list"><cover-image class="imgs1" style="width: 30px; height: 30px; " src="../../static/a2.png"></cover-image><text class="txt">我的订单</text><cover-image class="imgs" style="width: 30px; height: 30px; " src="../../static/nest.png"></cover-image></view><view class="list"><cover-image class="imgs1" style="width: 30px; height: 30px; " src="../../static/a3.png"></cover-image><text class="txt">我的卷包</text><cover-image class="imgs" style="width: 30px; height: 30px; " src="../../static/nest.png"></cover-image></view><view class="list"><cover-image class="imgs1" style="width: 30px; height: 30px; " src="../../static/a4.png"></cover-image><text class="txt">消息管理</text><cover-image class="imgs" style="width: 30px; height: 30px; " src="../../static/nest.png"></cover-image></view></view></view></view></view>
</template><script>export default {data() {return {userinfo: {},isauto: false}},methods: {goback() {uni.navigateBack()},bindGetUserInfo() {var _this = this//新版登录方式uni.getUserProfile({desc: '获取您个人信息用于登录！',success: (res) => {uni.setStorageSync('userinfo', res.userInfo);_this.userinfo = res.userInfo_this.isauto = true;},fail: (res) => {// uni.showModal({//     title: '授权提示',//     content: '如果拒绝授权，将不能获取你的个人信息',//     success: function (res) {//         if (res.confirm) {//            wx.openSetting({// 			success: res => {// 			  if (res.authSetting['scope.userInfo']) {// 				// 授权成功，重新定位// 				 console.log("授权成功，重新定位")// 			  } else {// 				// 没有允许定位权限// 				wx.showToast({// 				  title: '您拒绝了权限，将无法使用个人信息',// 				  icon: 'none'// 				});// 			  }// 			}// 		  });//         } else if (res.cancel) {//             console.log('用户点击取消');//         }//     }// });}})},},created: function() {const value = uni.getStorageSync('userinfo');if (value) {this.isauto = true;this.userinfo = value;}}}
</script><style scoped>.status_bar {height: var(--status-bar-height);width: 100%;}.userinfo {width: 100%;height: 170px;position: relative;}.userinfo .userinfotop {width: 100%;height: 170px;position: absolute;top: 0px;left: 0px;background: #2CD7C7;filter: blur(15px);background-size: 100% 100%;}.infoboot {width: 100%;height: 100px;position: absolute;top: 50px;left: 0px;display: flex;}.back {width: 100%;height: 40px;position: absolute;top: 0px;left: 0px;}.back .img {margin: 10px;}.left {width: 100px;height: 100px;position: relative;}.left .img {border-radius: 100%;width: 80px;height: 80px;position: absolute;top: 0px;left: 10px;}.login-btn {border-radius: 100%;width: 80px;height: 80px;background: red;position: absolute;top: 0px;left: 10px;background: url("../../static/pic.png");background-size: cover;}.right {flex: 1;text-align: left;line-height: 100px;font-size: 18px;color: #fff;margin-left: 10px;}.listmain {width: 100%;min-height: 500px;margin: -20px auto 0px auto;background: #fff;border-top-right-radius: 15px;border-top-left-radius: 15px;z-index: 1;}.list {display: flex;width: 95%;height: 40px;margin: 5px auto;}.list .imgs1 {width: 50px;height: 100%;margin: 5px;}.list .txt {flex: 1;line-height: 40px;margin-left: 10px;font-weight: 400;}.list .imgs {width: 50px;height: 100%;margin: 5px;}
</style>

static图片下载地址
链接：https://pan.baidu.com/s/1qaDvZLLvNdSaTXIOTn9cvg
提取码：1111


http://chatgpt.dhexx.cn/article/VHL0S4v5.shtml

相关文章

扫盲篇 | 你真的懂附近的小程序吗？

扫盲篇 | 你真的懂附近的小程序吗？

“附近的小程序”功能是指用户进入微信小程序界面以后，可以直接看到所在地周围5公里左右的所有“小程序”。 包括实体店，服务店，商场等，微信小程序上线之初就曾提及该功能，而它几乎成了零售领域最期待的一项功能。 所以许多行业人士指出，小程序会给零售行业发展带来巨大…
阅读更多...
有哪些常见的微信小程序推广引流方法？

有哪些常见的微信小程序推广引流方法？

如何对小程序进行推广引流。只有如此&#xff0c;才能为小程序获取到更多忠实用户&#xff0c;使小程序实现更大的价值。今天就为大家介绍一下微信小程序常见有效的推广方式。 1、附近的小程序&#xff08;免费&#xff09; 在小程序后台&#xff0c;开通“附近的小程序”&am…
阅读更多...
微信附近的人小程序怎么开（开通附近小程序的方法）

微信附近的人小程序怎么开（开通附近小程序的方法）

1、进入微信公众号平台进入&#xff0c;输入小程序账号和密码&#xff0c;点击登录&#xff1b; 2、在左侧菜单中找到“附近的小程序”&#xff0c;点击开通。&#xff08;个体小程序不支持开通&#xff09; 3、验证管理员身份后按照要求填写资料&#xff0c;点击定位&#xf…
阅读更多...
C语言/C++初学 问题

C语言/C++初学 问题

编程及C/C初学者 FAQ 本文原为本人在论坛所发若干帖&#xff0c;意在集中解决新手学习C/C语言时将遭遇到的各类问题&#xff0c;网友反馈情况良好&#xff0c;集合修订后作为个人作品贴于此处。 本贴主要分析概念原理和解决方案&#xff0c;不讨论具体程序语法&#xff0c;立足…
阅读更多...
matlab2c使用c++实现matlab函数系列教程-randint函数

matlab2c使用c++实现matlab函数系列教程-randint函数

全栈工程师开发手册 &#xff08;作者&#xff1a;栾鹏&#xff09; matlab2c动态链接库下载 matlab库函数大全 matlab2c基础教程 matlab2c开发全解教程 matlab2c调用方法&#xff1a; 1、下载动态链接库 2、将Matlab2c.dll拷贝到exe同目录下 3、将Matlab2c.h、Matlab2c.lib放…
阅读更多...
MATLAB只randint函数

MATLAB只randint函数

srandint(M,N,range); 生成MxN的矩阵&#xff0c;矩阵中元素的取值为小于range的整数。 M4; N3; range3; srandint(M,N,range) 注意&#xff1a; randi函数生成元素取值为1&#xff1a;M的N*range的矩阵。
阅读更多...
python中randint_python中randint函数的用法是什么？_后端开发

python中randint_python中randint函数的用法是什么？_后端开发

php的数据库怎么安装？_后端开发 安装步骤：1、在官网上下载数据库软件，然后双击下载好的数据库软件，打开后点击右下角的“下一步”，选择第一个选项“我接受”；2、默认勾选所有插件；3、选择安装数据库位置，点击“安装”；4、点击“完成”，这时php数据库就安装成功了。 …
阅读更多...
Random.Randint 函数--Numpy

Random.Randint 函数--Numpy

Numpy.Random.Randint 函数功能&#xff1a; Return random integers from low (inclusive) to high (exclusive)。 Return random integers from the “discrete uniform” distribution of the specified dtype in the “half-open” interval [low, high). If high is None…
阅读更多...
Random库中的8个函数

Random库中的8个函数

random库包括两类函数&#xff0c;常用共8个 基本随机函数&#xff1a;seed() 、random()&#xff1b;扩展随机函数&#xff1a;randint()、getrandbits()、uniform()、randrange()、choice()、shuffle() 基本随机函数&#xff1a; seed()函数&#xff1a;初始化给定的随机数…
阅读更多...
maven下载安装及IDEA配置、使用maven导出项目jar包并部署到服务器上

maven下载安装及IDEA配置、使用maven导出项目jar包并部署到服务器上

目录 1.下载安装 2.增加maven镜像仓库和修改仓库下载位置 镜像配置 修改仓库下载位置 3.小试&#xff1a;在idea中创建一个新maven项目 4.IDEA上配置maven 5.maven导出项目jar包 6.导出的项目jar包部署到服务器上 1.下载安装 &#xff08;1&#xff09;进入下载地址Ma…
阅读更多...
maven的下载安装配置教程

maven的下载安装配置教程

maven的下载安装配置教程&#xff08;详细图文&#xff09; **各有各的选择&#xff0c;这也是一种过程**想要实现一个优秀的项目&#xff0c;光靠自己一个码农是很难的&#xff0c;我们需要引入别人已经集成好的类包来帮助我们优化项目&#xff0c;这个时候就需要使用maven了。…
阅读更多...
Maven 的下载安装教程

Maven 的下载安装教程

Maven 3.6.3 下载安装教程 笔者的环境&#xff1a; JDK 13.0.2 Maven 3.6.3 IntelliJ IDEA 2020.1.2 (Ultimate Edition) 在继续阅读本教程之前&#xff0c;需要先完成 JDK 的安装。关于 JDK 的安装&#xff0c;可见笔者的另一篇博客&#xff1a; Java 的下载安装教程&…
阅读更多...
Maven的下载安装与使用（idea）

Maven的下载安装与使用（idea）

Maven是什么 Maven是一款服务于Java平台的自动化构建工具。Maven 作为 Java 项目管理工具&#xff0c;它不仅可以用作包管理&#xff0c;还有许多的插件&#xff0c;可以支持整个项目的开发、打包、测试及部署等一系列行为。 传统工程我们直按把jar包放置在项目中&#xff0c; …
阅读更多...
maven下载安装配置远程本地仓库

maven下载安装配置远程本地仓库

一、简介 maven最主要体现在两个词上&#xff1a;项目和管理。maven给我们整个开发团队找出了一种能够更加科学的去管理我们项目的思想。maven通过使用配置文件的方式使得项目在管理和交接的过程中成本变得非常低。maven提出了一种叫做maven仓库的概念,使得我们可以将第三方和我…
阅读更多...
maven 下载安装及配置

maven 下载安装及配置

Maven 下载及配置 1.Maven 下载 Maven官网地址&#xff1a;https://maven.apache.org/download.cgi 1.1 进入Maven官网&#xff0c;点击 archives 1.2 选择你需要的版本点击下载&#xff0c;此处以3.6.2示例1.3 找到下载的压缩包&#xff0c;并解压2.配置环境变量 2.1 首先在…
阅读更多...
maven下载安装

maven下载安装

1、下载maven maven官网下载地址&#xff1a; https://maven.apache.org/download.cgi 2、将下载好的 maven压缩包 解压到自己要安装的目录 3、给maven配置环境变量 3.1、 3.2、 3.3、添加系统变量 添加MAVEN_HOME变量 添加M2_HOME变量 因为在springboot中引用到该路径&#…
阅读更多...
maven下载安装及配置

maven下载安装及配置

一、maven下载安装 1. 搜索maven或直接进入apache官网&#xff08;https://maven.apache.org/&#xff09;下载。&#xff08;安装maven的前提是&#xff0c;jdk已安装成功&#xff09; 注&#xff1a;Winodws操作系统下载*.zip&#xff1b;Linux操作系统下载*.gz。 解压缩后&a…
阅读更多...
Maven下载安装的详细教程

Maven下载安装的详细教程

文章目录 一、Maven简介1.1 什么是依赖管理1.2 什么是项目构建1.3 Maven的核心概念 二、下载、安装、配置2.1 下载2.2 安装2.3 配置maven的环境变量2.4 Maven 软件版本测试 三、Maven 仓库3.1. Maven的仓库分类3.2 Maven 本地仓库的配置3.3 配置阿里云远程仓库3.4 profile配置 …
阅读更多...
Maven下载安装及其配置

Maven下载安装及其配置

Maven下载安装及其配置 文章目录 Maven下载安装及其配置1、Maven介绍2、Maven下载安装2.1、最新2.2、旧版3.8 3、Maven环境配置3.1、配置3.2、验证3.3、 配置本地仓库 4、Maven使用4.1、Maven常用命令4.2、IDEA中的使用 1、Maven介绍 Maven 是一个流行的构建工具和依赖管理工具…
阅读更多...
Maven下载安装及IDEA配置Maven的超详细教程

Maven下载安装及IDEA配置Maven的超详细教程

Maven下载安装及IDEA配置Maven的超详细教程 1、IntelliJ IDEA 下载、安装及配置过程2、maven下载、安装、配置过程2.1 mavan下载2.2 安装2.3 配置 3、在IDEA中配置Maven3.1 进入设置界面3.2 maven配置 4、IDEAmaven创建工程示例 Maven是一个能使我们的java程序开发节省时间和精…
阅读更多...
推荐文章

Copyright @ 2022~2023