關於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一下,寫得亂七八糟,希望又遇到此類問題的兄弟少走彎路了。