非同步 JS 訓練一:第3課 ── 認識 async/await 語法

by birdie2019

HTML

<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<p>尊貴的客戶您好,您上次的消費內容是:</p>
<ul>
  <li class="id"></li>
  <li class="content"></li>
  <li class="amount"></li>
</ul>
<p>希望這次也能有機會服務您!</p>

JavaScript

const lastOrderInfo = async () => {
  const getCurrentUser = await $.get("https://codelove.tw/fake-api/get-current-user");
  const userID = {
    user_id: getCurrentUser.data.user.id
  };
  const getOrders = await $.get("https://codelove.tw/fake-api/get-orders", userID);
  const lastOrder = {
    order_id: getOrders.data.orders.length
  };
  const getLastOrderDetails = await $.get("https://codelove.tw/fake-api/get-order-details", lastOrder);
  $('.id').text(`訂單編號:${getLastOrderDetails.data.order.id}`);
  $('.content').text(`訂單內容:${getLastOrderDetails.data.order.content}`);
  $('.amount').text(`訂單金額:${getLastOrderDetails.data.order.amount}`);
}

lastOrderInfo();