docs: 增加提示信息，格式化代码

pages/API/choose-location/choose-location.uvue

@@ -18,6 +18,7 @@
         </block>
       </view>
       <view class="uni-btn-v">
+        <view class="tips">注意：需要正确配置地图服务商的Key才能正常选择位置</view>
         <button type="primary" @tap="chooseLocation">选择位置</button>
         <button @tap="clear">清空</button>
       </view>
@@ -25,7 +26,7 @@
   </view>
 </template>
 <script lang="uts">
-	function formatLocation(longitude, latitude) {
+  function formatLocation (longitude, latitude) {
     if (typeof longitude === 'string' && typeof latitude === 'string') {
       longitude = parseFloat(longitude)
       latitude = parseFloat(latitude)
@@ -38,7 +39,7 @@
     }
   }
   export default {
-		data() {
+    data () {
       return {
         title: 'chooseLocation',
         hasLocation: false,
@@ -50,9 +51,9 @@
       chooseLocation: function () {
         uni.chooseLocation({
           success: (res) => {
-            console.log(res,123)
-						this.hasLocation = true,
-						this.location = formatLocation(res.longitude, res.latitude),
+            console.log(res, 123)
+            this.hasLocation = true
+            this.location = formatLocation(res.longitude, res.latitude)
             this.locationAddress = res.address
           }
         })
@@ -69,4 +70,10 @@
     padding-bottom: 0;
     height: 440rpx;
   }
+
+  .tips {
+    font-size: 12px;
+    margin-top: 15px;
+    opacity: .8;
+  }
 </style>

pages/API/open-location/open-location.uvue

@@ -9,7 +9,7 @@
               <view class="uni-label">经度</view>
             </view>
             <view class="uni-list-cell-db">
-							<input class="uni-input" type="text" :disabled="true" value="116.39747" name="longitude"/>
+              <input class="uni-input" type="text" :disabled="true" value="116.39747" name="longitude" />
             </view>
           </view>
           <view class="uni-list-cell">
@@ -17,7 +17,7 @@
               <view class="uni-label">纬度</view>
             </view>
             <view class="uni-list-cell-db">
-							<input class="uni-input" type="text" :disabled="true" value="39.9085" name="latitude"/>
+              <input class="uni-input" type="text" :disabled="true" value="39.9085" name="latitude" />
             </view>
           </view>
           <view class="uni-list-cell">
@@ -25,7 +25,7 @@
               <view class="uni-label">位置名称</view>
             </view>
             <view class="uni-list-cell-db">
-							<input class="uni-input" type="text" :disabled="true" value="天安门" name="name"/>
+              <input class="uni-input" type="text" :disabled="true" value="天安门" name="name" />
             </view>
           </view>
           <view class="uni-list-cell">
@@ -33,11 +33,12 @@
               <view class="uni-label">详细位置</view>
             </view>
             <view class="uni-list-cell-db">
-							<input class="uni-input" type="text" :disabled="true" value="北京市东城区东长安街" name="address"/>
+              <input class="uni-input" type="text" :disabled="true" value="北京市东城区东长安街" name="address" />
             </view>
           </view>
         </view>
         <view class="uni-padding-wrap">
+          <view class="tips">注意：需要正确配置地图服务商的Key才能正常显示位置</view>
           <view class="uni-btn-v uni-common-mt">
             <button type="primary" formType="submit">查看位置</button>
           </view>
@@ -48,7 +49,7 @@
 </template>
 <script lang="uts">
   export default {
-		data() {
+    data () {
       return {
         title: 'openLocation'
       }
@@ -72,4 +73,10 @@
   .uni-list-cell-left {
     padding: 0 30rpx;
   }
+
+  .tips {
+    font-size: 12px;
+    margin-top: 15px;
+    opacity: .8;
+  }
 </style>

pages/component/map/map.uvue

 <template>
   <view class="content">
-    <map class="map" id="map1" ref="map1" :longitude="location.longitude" :latitude="location.latitude" :scale="scale" :markers="markers" :include-points="includePoints" :polyline="polyline" :polygons="polygons" :circles="circles" :controls="controls" :show-location="showLocation"
-      :enable-3D="enable3D" :rotate="rotate" :skew="skew"
+    <map class="map" id="map1" ref="map1" :longitude="location.longitude" :latitude="location.latitude" :scale="scale"
+      :markers="markers" :include-points="includePoints" :polyline="polyline" :polygons="polygons" :circles="circles"
+      :controls="controls" :show-location="showLocation" :enable-3D="enable3D" :rotate="rotate" :skew="skew"
       :show-compass="showCompass" :enable-overlooking="enableOverlooking" :enable-zoom="enableZoom"
       :enable-scroll="enableScroll" :enable-rotate="enableRotate" :enable-satellite="enableSatellite"
-      :enable-traffic="enableTraffic"
-      @markertap="onmarkertap" @callouttap="oncallouttap" @controltap="oncontroltap" @regionchange="onregionchange" @tap="maptap"
-      @updated="onupdated" @poitap="onpoitap"></map>
+      :enable-traffic="enableTraffic" @markertap="onmarkertap" @callouttap="oncallouttap" @controltap="oncontroltap"
+      @regionchange="onregionchange" @tap="maptap" @updated="onupdated" @poitap="onpoitap"></map>
     <scroll-view class="scrollview" scroll-y="true">
-      <view>注意：需要正确配置地图服务商的Key才能正常显示地图组件</view>
+      <view class="tips">注意：需要正确配置地图服务商的Key才能正常显示地图组件</view>
       <view class="uni-title">
         <text class="uni-title-text">属性示例</text>
       </View>
-      <input-data defaultValue="13" title="scale: 缩放级别，取值范围为5-18" type="number" @confirm="confirm_scale_input"></input-data>
+      <input-data defaultValue="13" title="scale: 缩放级别，取值范围为5-18" type="number"
+        @confirm="confirm_scale_input"></input-data>
       <boolean-data :defaultValue="showLocation" title="开启显示带有方向的当前定位点" @change="change_show_location"></boolean-data>
 
       <button class="button" @click="addControls">控件</button>
@@ -37,80 +38,80 @@
 
 <script setup lang="uts">
   type Anchor = {
-    x : number,
-    y : number
+    x: number,
+    y: number
   }
 
   type Callout = {
-    content : string,
-    color : string,
-    fontSize : number,
-    borderRadius : number,
-    borderWidth : number,
-    borderColor : string,
-    bgColor : string,
-    padding : number,
-    display : string
+    content: string,
+    color: string,
+    fontSize: number,
+    borderRadius: number,
+    borderWidth: number,
+    borderColor: string,
+    bgColor: string,
+    padding: number,
+    display: string
   }
 
   type Label = {
-    content : string,
-    color : string,
-    fontSize : number,
-    x : number,
-    y : number,
+    content: string,
+    color: string,
+    fontSize: number,
+    x: number,
+    y: number,
     borderColor: string
-    borderWidth : number,
+    borderWidth: number,
     borderRadius: number,
-    bgColor : string,
-    padding:number
+    bgColor: string,
+    padding: number
   }
 
   type Markers = {
-    id : number,
-    latitude : number,
-    longitude : number,
-    title ?: string,
-    iconPath : string,
-    zIndex ?: string,
-    rotate ?: number,
-    width ?: number,
-    height ?: number,
-    label?:Label,
-    anchor ?: Anchor,
-    callout ?: Callout
+    id: number,
+    latitude: number,
+    longitude: number,
+    title?: string,
+    iconPath: string,
+    zIndex?: string,
+    rotate?: number,
+    width?: number,
+    height?: number,
+    label?: Label,
+    anchor?: Anchor,
+    callout?: Callout
   }
 
   type Points = {
-    latitude : number,
-    longitude : number
+    latitude: number,
+    longitude: number
   }
 
   type Polyline = {
-    points : Points[],
-    color : string,
-    width : number,
-    dottedLine : boolean,
-    arrowLine : boolean,
-    borderColor : string,
-    borderWidth : number
+    points: Points[],
+    color: string,
+    width: number,
+    dottedLine: boolean,
+    arrowLine: boolean,
+    borderColor: string,
+    borderWidth: number
   }
 
   type Polygons = {
-    points : Points[];
-    fillColor : string;
-    strokeWidth : number;
-    strokeColor : string;
-    zIndex : number;
+    points: Points[];
+    fillColor: string;
+    strokeWidth: number;
+    strokeColor: string;
+    zIndex: number;
   }
 
   type Circles = {
-    latitude : number;
-    longitude : number;
-    radius : number;
-    strokeWidth : number;
-    color : string;
-    fillColor : string;
+    latitude: number;
+    longitude: number;
+    radius: number;
+    strokeWidth: number;
+    color: string;
+    fillColor: string;
   }
 
   type PositionType = {
@@ -123,18 +124,18 @@
   type ControlsType = {
     id?: number;
     position: PositionType;
-    iconPath:string;
+    iconPath: string;
     clickable?: boolean;
   }
 
   type TypeJestResult = {
-    translateMarkerMsg:string,
-    animationEnd:boolean,
+    translateMarkerMsg: string,
+    animationEnd: boolean,
     centerPoints: Points,
     southwest: Points,
     northeast: Points,
-    moveToLocationMsg:string,
-    scale:number
+    moveToLocationMsg: string,
+    scale: number
   }
 
   const testMarkers = [{
@@ -180,7 +181,7 @@
       content: '首都北京\n天安门',
       color: '#00BFFF',
       fontSize: 12,
-      borderRadius:10,
+      borderRadius: 10,
       borderWidth: 2,
       borderColor: '#333300',
       bgColor: '#CCFF11',
@@ -201,7 +202,7 @@
       longitude: 116.520285
     }],
     color: '#FFCCFF',
-    width:7,
+    width: 7,
     dottedLine: true,
     arrowLine: true,
     borderColor: '#000000',
@@ -333,22 +334,22 @@
 
 
   const jestResult = reactive({
-    translateMarkerMsg:"",
-    animationEnd:false,
+    translateMarkerMsg: "",
+    animationEnd: false,
     centerPoints: {
-      latitude : 0,
-      longitude : 0
+      latitude: 0,
+      longitude: 0
     },
     southwest: {
-      latitude : 0,
-      longitude : 0
+      latitude: 0,
+      longitude: 0
     },
     northeast: {
-      latitude : 0,
-      longitude : 0
+      latitude: 0,
+      longitude: 0
     },
-    moveToLocationMsg:"",
-    scale:0,
+    moveToLocationMsg: "",
+    scale: 0,
   } as TypeJestResult);
 
 
@@ -361,7 +362,7 @@
     scale.value = value
   };
 
-  const controls = ref([]as ControlsType[]);
+  const controls = ref([] as ControlsType[]);
   const addControls = () => {
     controls.value.push({
       id: 1,
@@ -377,7 +378,7 @@
   }
 
   const showLocation = ref(false);
-  const change_show_location = (checked : boolean)=>{
+  const change_show_location = (checked: boolean) => {
     showLocation.value = checked
   }
 
@@ -395,13 +396,13 @@
   const addMarkersLabel = () => {
     markers.forEach((marker, index) => {
       marker.label = {
-        content: 'Hello Label'+ (index + 1),
+        content: 'Hello Label' + (index + 1),
         color: '#aa00ff',
         fontSize: 12,
         x: 5,
         y: 0,
-        borderColor:'#333300',
-        borderWidth:2,
+        borderColor: '#333300',
+        borderWidth: 2,
         borderRadius: 20,
         bgColor: '#aaffff',
         padding: 10
@@ -439,10 +440,10 @@
   const enableSatellite = ref(false);
   const enableTraffic = ref(false);
 
-  const enableThreeD = (e)=>{
+  const enableThreeD = (e) => {
     enable3D.value = e.detail.value;
   }
-  const changeShowCompass = (e)=>{
+  const changeShowCompass = (e) => {
     showCompass.value = e.detail.value;
   }
   const changeEnableOverlooking = (e) => {
@@ -476,7 +477,7 @@
         success: ret => {
           // console.log('getCenterLocation',ret);
           jestResult.centerPoints = ret;
-          if(!autoTest.value){
+          if (!autoTest.value) {
             uni.showModal({
               content: JSON.stringify(ret)
             });
@@ -493,7 +494,7 @@
           // console.log('getRegion',JSON.stringify(ret));
           jestResult.southwest = ret.southwest;
           jestResult.northeast = ret.northeast
-          if(!autoTest.value){
+          if (!autoTest.value) {
             uni.showModal({
               content: JSON.stringify(ret)
             });
@@ -512,8 +513,8 @@
           latitude: 39.989631,
           longitude: 116.481018
         },
-        autoRotate:true,
-        rotate:10,
+        autoRotate: true,
+        rotate: 10,
         duration: 2000,
         animationEnd: () => {
           // console.log('动画结束');
@@ -538,9 +539,9 @@
           // console.log('getScale',res);
           scale.value = res.scale
           jestResult.scale = res.scale
-            if(!autoTest.value){
+          if (!autoTest.value) {
             uni.showModal({
-                content: '当前地图的缩放级别为：'+ res.scale
+              content: '当前地图的缩放级别为：' + res.scale
             });
           }
         },
@@ -559,7 +560,7 @@
         success: res => {
           // console.log('moveToLocation',res);
           jestResult.moveToLocationMsg = res.errMsg;
-            if(!autoTest.value){
+          if (!autoTest.value) {
             uni.showModal({
               content: JSON.stringify(res)
             });
@@ -572,43 +573,43 @@
     }
   };
 
-  const maptap = (e:UniEvent) => {
+  const maptap = (e: UniEvent) => {
     // console.log('点击地图时触发',e)
     uni.showModal({
       content: JSON.stringify(e)
     });
   };
 
-  const onmarkertap = (e:UniEvent) => {
+  const onmarkertap = (e: UniEvent) => {
     // console.log('点击标记点时触发',e)
     uni.showModal({
       content: JSON.stringify(e)
     });
   };
 
-  const oncontroltap = (e:UniEvent) => {
+  const oncontroltap = (e: UniEvent) => {
     // console.log('点击控件时触发',e)
     uni.showModal({
       content: JSON.stringify(e)
     });
   };
 
-  const oncallouttap = (e:UniEvent) => {
+  const oncallouttap = (e: UniEvent) => {
     // console.log('点击标记点对应的气泡时触发',e)
     uni.showModal({
       content: JSON.stringify(e)
     });
   };
 
-  const onupdated = (e:UniEvent) => {
-    console.log('在地图渲染更新完成时触发',e)
+  const onupdated = (e: UniEvent) => {
+    console.log('在地图渲染更新完成时触发', e)
   };
 
-  const onregionchange = (e:UniEvent) => {
-    console.log('视野发生变化时触发',e)
+  const onregionchange = (e: UniEvent) => {
+    console.log('视野发生变化时触发', e)
   };
 
-  const onpoitap = (e:UniEvent) => {
+  const onpoitap = (e: UniEvent) => {
     // console.log('点击地图poi点时触发',e)
     uni.showModal({
       content: JSON.stringify(e)
@@ -632,7 +633,6 @@
     handleMoveToLocation,
     handleGetScale
   })
-
 </script>
 
 <style>
@@ -666,4 +666,10 @@
     margin-top: 5px;
     margin-bottom: 5px;
   }
+
+  .tips {
+    font-size: 12px;
+    margin-top: 15px;
+    opacity: .8;
+  }
 </style>