uniapp开发app常见问题

一、uniapp使用new Date().toLocaleString导致手机端时间转化NAN

1.默认是这样的,但是到了手机端会显示上午或者下午,用日期转化的时候是NAN
date.toLocaleString()
2.要转化一下
date.toLocaleString('chinese', {hour12: false})

或者使用函数方法
getTime:function(){
	var date = new Date(),
	year = date.getFullYear(),
	month = date.getMonth() + 1,
	day = date.getDate(),
	hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours(),
	minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes(),
	second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
	month >= 1 && month <= 9 ? (month = "0" + month) : "";
	day >= 0 && day <= 9 ? (day = "0" + day) : "";
	var timer = year + '/' + month + '/' + day + ' ' + hour + ':' + minute + ':' + second;
	return timer;
},

二、打包app没有Dom,使用renderjs

<template>
  <view>
        <view  :msg="msg" :change:msg="renderScript.receiveMsg" class="renderjs" id="renderjs-view">
			{{msg}}
		</view>
        <button @click="renderScript.emitData">直接调用renderjs中的emitData的方法</button>
		<button @click="changeMsg" class="app-view">改变msg的值,直接调用renderjs中receiveMsg的值</button>
		<button @click="renderScript.renferMsg">通过renderjs改变msg的值,同时调用renderjs中的emitData的方法</button>
  </view>
</template>
 
<script>
  export default {
    data() {
      return {
        msg: '我是service层原来的msg',
      };
    },
    methods: {
      // 触发逻辑层出入renderjs数据改变
      changeMsg() {
        this.msg = "msg值改变了";
      },
      // 接收renderjs发回的数据
      receiveRenderData(val) {
        console.log('renderjs返回的值-->', val);
      },
	  //接收renderjs发回的数据,同时触发:change:msg,调用enderjs中的emitData的方法
	  serviceClick(e){
		  this.msg=e
	  }
    }
  };
</script>
 
<script module="renderScript" lang="renderjs">
    export default {
      data() {
        return {
          name: '我是renderjs数据'
        }
      },
      methods: {
		  renferMsg(event, ownerInstance) {
		  	// 调用 service层的serviceClick方法,传值
			console.log(event,ownerInstance)
		  	ownerInstance.callMethod('serviceClick', {
		  		test: '这是点击renderjs的区域,向service层传递变量'
		  	})
		  },
        // 接收逻辑层发送的数据
        receiveMsg(newValue, oldValue, ownerVm, vm) {
          console.log('msg变化了newValue', newValue)
          console.log('msg变化了oldValue', oldValue)
          console.log('msg变化了ownerVm', ownerVm)
          console.log('msg变化了vm', vm)
        },
        // 发送数据到逻辑层
        emitData(e, ownerVm) {
          ownerVm.callMethod('receiveRenderData', this.name)
        }
      }
    };
</script>

三、app中echart不支持3D图表

<view class="echarts">
 <view id="myEcharts" ref="myEcharts" style="height: 100%;width: 100%;"></view>
  <view :dataItem="pieData" :change:dataItem="myEcharts.dataChange"></view>
</view>
 <script module="myEcharts" lang="renderjs">
  import * as echarts from 'echarts'
  import 'echarts-gl' // 3d图表库
	export default {
		data() {
			return {
				chart: null,
        dom: '',
        data: [],
			}
		},
		mounted() {
      this.dom = document.getElementById('myEcharts')
      // let echarts = new this.$echarts
      // if (typeof window.echarts === 'object') {
			// 	this.init()
			// } else {
			// 	// 动态引入类库
			// 	const script = document.createElement('script')
			// 	script.src = './static/echarts.min.js'
			// 	script.src = './static/echarts-gl.min.js'
			// 	script.onload = this.init
			// 	document.head.appendChild(script)
			// }
      this.init()
		},
    watch: {
      data(val) {
        // this.data = val;
        this.update(val)
      }
    },
		methods: {
			/** 初始化echarts */
			init() {
				if(echarts) {
          this.chart = echarts.init(this.dom)
        }
			},
			update(data) {
        let list = []
				if (this.chart) {
          if (data) {
            if (data.length > 0) {
              data.forEach(item => {
                list.push({
                  type: 'scatter3D',
                  symbolSize: 6,
                  encode: {
                    x: 'x',
                    y: 'y',
                    z: '高度',
                    tooltip: [0, 1, 2, 3, 4]
                  },
                  data: item.numData,
                })
              })
            } else {
              // list = [[0, 0, 0]]
              list = [{
                name: '测缝',
                type: 'scatter3D',
                symbolSize: 6,
                encode: {
                  x: 'x',
                  y: 'y',
                  z: '高度',
                  tooltip: [0, 1, 2, 3, 4]
                },
                data: [[0, 0, 0]],
              }]
            }
            // 这里开始就是echarts的配置项了
            let option = {
              trigger: 'axis',
              axisPointer: {
                type: 'cross'
              },
              grid3D: {
                axisLine: {
                  lineStyle: {
                    color: '#555'
                  }
                },
                axisPointer: {
                  lineStyle: {
                    color: 'red'
                  }
                },
                viewControl: {
                  beta: 55,
                },
                boxWidth: 120,
                boxHeight: 120,
                boxDepth: 120,
                width: '100%'
              },
              xAxis3D: {
                name: '宽度(mm)',
                type: 'value',
                scale: true
              },
              yAxis3D: {
                name: '深度(mm)',
                type: 'value',
                scale: true
              },

              zAxis3D: {
                name: '水平(mm)',
                type: 'value',
                scale: true
              },
              // dataset: {
              //   source: list
              // },
              series: list
            }
            this.chart.setOption(option)
          }
				}
			},
			// data的值发生改变时会触发dataChange
			dataChange(e) {
        if(e) {
          this.data = e;
          this.update(e)
        }
			}
		}
	}
</script>

你可能感兴趣的:(uniapp,uni-app)