基本的身分證檢查已經完成，可以檢查長度、地點、性別等等，但是缺少了檢查檢查碼的部分，這篇會說明如何建立檢查碼。

檢查碼功能 checkCkDigit()

增加檢核碼功能在 IDChecker.js中，這邊命名為 checkCkDigit。

• 主程式與計算功能

在這個功能中，會有幾個動作：把地點代碼換成數字、把數值計算、模數計算、檢查結果這幾個部分。這程式碼已經在 Day21說明，這邊不詳述。

• 把 checkCkDigit() 放入 .jsx

在匯入的地方把這個功能引入，就可以在 React 中使用。

import { checkBasic, checkCkDigit } from "./IDChecker";

當加入後，增加新功能，讓當按鈕被點擊後有個 handle 可以進行處理：

function IDCheck_checkDigit() {
  const r = checkCkDigit(id);
  setckDigitResult(r);
  console.log(`"result: ${ckDigitResult}, ${r}"`);
}

本日會進行增加檢查驗證碼的功能，用來做區別，因此顯示的畫面會是：

return (
    <div>
      <h1>檢查身份證</h1>
      <div>
        <label>輸入身分證字號：</label>
        <input
          itemType="text"
          className="idno"
          onChange={(e) => setId(e.target.value)}
        ></input>
        <button onClick={IDCheck}>檢查</button>
        <button onClick={IDCheck_checkDigit}>檢查：檢查碼</button>
      </div>
      <div>
        <label>
          身分證：{id}，結果：{result}
        </label>
      </div>
      <div>
        <label>
          身分證：{id}，檢查結果：{ckDigitResult}
        </label>
      </div>
    </div>
  );

這樣在 log 中可以看到檢查結果都正確囉！（但是這樣卻沒有在 label 顯示正確）

後記

儘管功能加上去了，但是顯示卻出問題，修改顯示問題是明日最大的課題。只要修正，這個檢查功能就完成了！