temp

config/dev.js

@@ -7,10 +7,10 @@ module.exports = {
     // WSS_HOST: '"wss://47.101.36.130:8085"',
     // HOST:  '"https://dev.jinchengjiaye.com"',//测试
     // WSS_HOST: '"wss://dev.jinchengjiaye.com"',
-    // HOST: '"https://lt.pawoma.cn"',
-    // WSS_HOST: '"wss://lt.pawoma.cn"',
-    HOST: '"http://127.0.0.1:8080"',
-    WSS_HOST: '"ws://127.0.0.1:8080"',
+    HOST: '"https://lt.pawoma.cn"',
+    WSS_HOST: '"wss://lt.pawoma.cn"',
+    // HOST: '"http://127.0.0.1:8080"',
+    // WSS_HOST: '"ws://127.0.0.1:8080"',
   },
   weapp: {},
   h5: {}

project.config.json

@@ -2,7 +2,7 @@
 	"miniprogramRoot": "dist/",
 	"projectname": "mini-chengjiao",
 	"description": "知与行",
-	"appid": "wxda1f84b79b3edeb3",
+	"appid": "wxd6f47a9bb3052175",
 	"setting": {
 		"urlCheck": false,
 		"es6": false,

src/components/charts/Line.js

@@ -1,5 +1,5 @@
 import Taro, { Component } from '@tarojs/taro'
-import echart from '../ec-canvas/echarts'
+import echarts from '../ec-canvas/echarts'
 
 function initChart(callback) {
   return function (canvas, width, height) {
@@ -13,6 +13,9 @@ function initChart(callback) {
   }
 }
 
+/**
+ * 传入 source 的格式为 [{ name: xxx, value: xxx }, {}]
+ */
 export default class LineChart extends Component {
   config = {
     usingComponents: {
@@ -25,24 +28,32 @@ export default class LineChart extends Component {
 
   state = {
     ec: { onInit: initChart(this.handleChart.bind(this)) },
-    loading: false,
   }
 
-  componentWillMount() {
+  // 禁止 props 变更时渲染
+  shouldComponentUpdate(nextProps) {
+    if (nextProps.source && nextProps.source.length) {
+      this.refreshChart(this.props.source)
+    }
 
+    return false
   }
 
   handleChart (chart) {
     this.echart = chart
-    if (!this.props.source) {
-      this.setState({ loading: true })
+    if (!this.props.source || !this.props.source.length) {
       this.echart.showLoading()
     } else {
-      this.refreshChart()
+      this.refreshChart(this.props.source)
     }
   }
 
-  refreshChart() {
+  refreshChart(source) {
+    if (!this.echart) {
+      console.warn('echarts not ready')
+      return;
+    }
+
     const defaultOpt = {
       color: ['#BB9C79', '#666666'],
       tooltip: {},
@@ -54,10 +65,10 @@ export default class LineChart extends Component {
 
     const options = {
       ...defaultOpt,
-      dataset: { source: this.props.source },
+      dataset: { source },
       series: {
         type: 'line',
-        dimensions: [ 'item' ],
+        dimensions: [ 'name' ],
       },
     }
 
@@ -66,6 +77,7 @@ export default class LineChart extends Component {
   }
 
   render() {
-    <ec-canvas id="mychart-dom-line" canvas-id="mychart-line" ec={this.state.ec}></ec-canvas>
+    return (
+      <ec-canvas style="width: 100%; height: 100%" ec={this.state.ec}></ec-canvas>)
   }
 }

src/pages/person/customerAnalysis/analysis.js

@@ -8,7 +8,7 @@ import "taro-ui/dist/style/components/progress.scss";
 import { savePoint, updatePoint } from '@services/common'
 import { querySexInfo } from '@services/person'
 import { connect } from '@tarojs/redux'
-import PieChart from "../../../components/PieChart";
+import LineChart from "../../../components/charts/Line";
 
 
 @connect(({ user, city }) => ({ user, city }))
@@ -69,9 +69,8 @@ export default class analysis extends Taro.Component {
       { value: 135, name: '视频广告' },
       { value: 1548, name: '搜索引擎' }
     ];
-    this.pieChart.refresh(chartData);
+
   }
-  refPieChart = (node) => this.pieChart = node
 
   render() {
 
@@ -83,7 +82,7 @@ export default class analysis extends Taro.Component {
         <AtTabs className="tab-bar" current={this.state.current} tabList={tabList} onClick={this.handleClick.bind(this)}>
           <AtTabsPane current={this.state.current} index={0} >
             <View>
-              <PieChart ref={this.refPieChart} />
+              <LineChart />
               <View style="height:20rpx;background:#f5f5f5;"> </View>
               <View style="padding: 40rpx;">
                 <View style="font-size: 36rpx;color: #666;margin-bottom:20rpx;">性别</View>
@@ -97,7 +96,7 @@ export default class analysis extends Taro.Component {
           </AtTabsPane>
           <AtTabsPane current={this.state.current} index={1}>
           <View>
-              <PieChart ref={this.refPieChart} />
+              <LineChart />
               <View style="height:20rpx;background:#f5f5f5;"> </View>
               <View style="padding: 40rpx;">
                 <View style="font-size: 36rpx;color: #666;margin-bottom:20rpx;">性别</View>
@@ -111,7 +110,7 @@ export default class analysis extends Taro.Component {
           </AtTabsPane>
           <AtTabsPane current={this.state.current} index={2}>
           <View>
-              <PieChart ref={this.refPieChart} />
+              <LineChart />
               <View style="height:20rpx;background:#f5f5f5;"> </View>
               <View style="padding: 40rpx;">
                 <View style="font-size: 36rpx;color: #666;margin-bottom:20rpx;">性别</View>