關於VUE+G2chat的使用問題

關於VUE+G2chat的使用問題

遇到的問題:
1、axios獲取數據後無法獲取顯示到圖中
2、返回的json將int自動轉換成string
3、G2圖表不能顯示數據,async的問題
第一個問題解決辦法:
採用異步模式

    async initData () {//此處異步拉取數據解決G2無法獲取數據問題
		const params = {
		    fit: this.fit
		    }
		this.dep = await scoreService.scorecharts(params);
    },

第二個問題解決辦法:

//返回JSON
echo json_encode(array(

                //"recordsTotal" => count($ob),
                "statusCode" => $res['statusCode'],
                //"recordsFiltered" => intval($recordsFiltered),
                //"ob"=>$ob,
                "msg"=>$res['msg'],
                "data"=>$res['data'],
                // "ceshi"=>$q['password'],
            ),JSON_UNESCAPED_UNICODE|JSON_NUMERIC_CHECK);

後端使用PHP,返回json:

echo json_encode默認會將數值轉換爲字符串。
解決辦法是在option中加入JSON_NUMERIC_CHECK。
option所有參數如下:

JSON_HEX_QUOT //所有的 < 和 > 轉換成 \u003C 和 \u003E。 自 PHP 5.3.0 起生效。
 
JSON_HEX_TAG //所有的 < 和 > 轉換成 \u003C 和 \u003E。 自 PHP 5.3.0 起生效。
 
JSON_HEX_AMP //所有的 & 轉換成 \u0026。 自 PHP 5.3.0 起生效。
 
JSON_HEX_APOS //所有的 ' 轉換成 \u0027。 自 PHP 5.3.0 起生效。
 
JSON_NUMERIC_CHECK //將所有數字字符串編碼成數字(numbers)。 自 PHP 5.3.3 起生效。
 
JSON_PRETTY_PRINT //用空白字符格式化返回的數據。 自 PHP 5.4.0 起生效。
 
JSON_UNESCAPED_SLASHES //不要編碼 /。 自 PHP 5.4.0 起生效。
 
JSON_FORCE_OBJECT //使一個非關聯數組輸出一個類(Object)而非數組。 在數組爲空而接受者需要一個類(Object)的時候尤其有用。 自 PHP 5.3.0 起生效。
 
JSON_PRESERVE_ZERO_FRACTION //確保浮點值始終被編碼爲浮點值。自 PHP 5.6.6 起生效。
 
JSON_UNESCAPED_UNICODE //以字面編碼多字節 Unicode 字符(默認是編碼成 \uXXXX)。 自 PHP 5.4.0 起生效。
 
JSON_PARTIAL_OUTPUT_ON_ERROR //替換一些不可編碼的值而不是失敗。自 PHP 5.6.6 起生效。

JSON_UNESCAPED_LINE_TERMINATORS //當提供JSON_UNESCAPED_UNICODE時,行終止符保持未轉義。它使用與PHP 7.1之前相同的行爲,沒有這個常數。自 PHP 7.1.0可用。

第三個問題解決辦法:
加個watch

  watch: {
    dep: {
      handler(newName, oldName) {
		this.chart.changeData(this.dep.rows);
        console.log('obj.a changed');
      },

啊,發現了json_encode的坑,asnyc異步獲取雖然在created中,但實際無法起到作用,還需要使用watch觀察。
OVER,MARK一下,寫得亂七八糟,希望又遇到此類問題的兄弟少走彎路了。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章