开发头条小程序小总结~

基本介绍

1.小程序js的运行进程跟视图层的运行进程是独立的，小程序js的运行进程跟视图层的运行进程是独立的，但是js是异步更新视图的。且无法直接访问视图的Dom

2.在开发过程中应用4个文件：.js,.json,.ttml,.ttss建立文件名必须 路径相同，文件名相同

生命周期

1.Page生命周期

onLoad() // 监听页面加载的时候
onReady() //监听页面初次渲染完成
onShow() //监听页面显示
onHide() //监听页面隐藏
onUnload() //监听页面卸载
复制代码

当进行页面跳转再返回当前页面的时候会有数据不更新的问题：
解决方法是可以把数据更新的方法放到onShow里面,会更新数据

2.App小程序的生命周期

onLaunch //小程序初始化
onShow //小程序显示
onHide //小程序隐藏
onError //错误监听函数
onPageNotFound //监听页面不存函数
复制代码

组件中遇到的问题 — map

1.map层级过高，导致设置页面的弹窗比map地图的层级底

<!-- 地图展示 -->
    <map
      id="myMapShare"
      show-location
      longitude="{{addressInfo.longitude}}"
      latitude="{{addressInfo.latitude}}"
      circles="{{addressInfo.circles}}"
      scale="{{addressInfo.scale}}"
      markers="{{addressInfo.markers}}"
    >
    </map>

    <!-- 弹窗，解决map地图层级过高问题，必须跟原生组件是兄弟关系 -->
    <view class="modal-bg" hidden="{{displayModal}}">
      <view class="modal-bg-fixed" bindtap='modalOpera'></view>
      <view class="modal-body">
        <view class="modal-title">请填写联系方式</view>
        <view class="modal-content-box clearfix">
          <image src="{{imgBaseAddr + 'icon_tel.png'}}"></image>
          <input type="number" placeholder="请输入手机号" 
          value="{{paramQueryTemp.workerMobile}}"
          bindinput='getWorkerMobile'
          />
        </view>
        <view class="modal-footer">
          <view class="modal-btn modal-confirm" catchtap='xhrSignUp'>好的</view>
        </view>
      </view>
    </view>
  </view>
复制代码

解决方案：把弹窗设置成map的兄弟关系，然后设置z-index值大于map的z-index

2.请求接口的时候，map地图不展示的问题
因为map地图先于接口请求展示，当map地图展示的时候数据为异步，可以加计时器，或者是添加开关，当数据请求回来的时候再展示map组件。

总结到这里~，项目正在开发中，如果遇上其他的问题将持续更新~~