vue之axios+php+mysql

博主原創，未經許可請勿轉載 哦

1.axios配置請看上篇

2.mysql數據庫編寫，表名爲area_list

  

3.json.php文件在notebeans中編寫

<?php
header('Content-type:text/html;charset=UTF-8');//utf-8編碼格式
header('Access-Control-Allow-Origin:http://localhost:8888');//爲項目寫跨域頭
$pdo = new PDO('mysql:host=localhost;dbname=redis', 'root', 'password');//pdo鏈接數據庫    擴展：pdo爲PHP訪問數據庫定義了一個輕量級的一致接口
$sql = "select mingcheng from area_list"
$stm = $pdo->query($sql);
  if ($stm) {
      $arr = $stm->fetchAll(PDO::FETCH_ASSOC);
      if ($arr) {
          echo json_encode($arr,JSON_UNESCAPED_UNICODE);//json_encode有中文時返回\u5317\u4eac格式，JSON_UNESCAPED_UNICODE轉爲中文
      } else {
          echo 0;
      }
  } else {
      echo 0;
  }

4.component.vue

   

this.$http.get('http://localhost:8000/json.php') //url爲php運行於自帶服務器的瀏覽器地址
.then(res=>{console.log(res)})
.catch(err=>{console.log(err)})

　　

5.服務器返回結果爲