# Sweetalert2 處理輸入欄位問題
以退款按鈕點擊事件舉例

$('#btn-apply-refund').click(function() {
  // 彈出確認框
  swal.fire({
    text: '請輸入退款理由',
    input: 'text', // 可輸入文字欄位
  })
    .then(function(input) {
      // 當用戶點擊 swal 彈出框上的按鈕時觸發這個函數
      if (!input['value']) {
        swal.fire('退款理由不得為空', '', 'error')
        return;
      }
      // 請求退款接口
      axios.post('{{ route('orders.apply_refund', [$order->id]) }}', {reason: input['value']})
        .then(function() {
          swal.fire('申請退款成功', '', 'success').then(function() {
            // 用戶點擊彈出框上按鈕重新加載頁面
            location.reload();
          });
        });
    });
  });

原本 `axios.post` 處的 `reason` 欄位取 `input` 作為值，但卻出現 Exception，說明我們給系統的參數為陣列，但系統要的是**字串**，如下圖所示：

在資料庫看到 `extra` 欄位有資料寫入，但不符合我們所要的：
可以發現我們要寫入資料庫的值需要將 `input` 改成 `input['value']` 才會是正確的，

再測試一次後就不會出現 Exception 了

資料庫中 `extra` 欄位顯示 `{"refund_reason":"\u8cb7\u932f"}`

###### tags: `sweetalert2` `axios`