yubinbango-core2というライブラリを使用し、郵便番号から住所検索を実現します。
環境
laravel9
Vue.js3
インストール
npm i yubinbango-core2@^0.6.3
packege.jsonに追記されていればOKです。
コード
Create.vue
<script setup>
import { Core as YubinBangoCore } from "yubinbango-core2";
// 数字を文字に変換 第1引数が郵便番号
// 第2がコールバックで引数に住所
const fetchAddress = () => {
new YubinBangoCore(String(form.postcode), (value) => {
form.address = value.region + value.locality + value.street
})
}
</script>
<template>
<input name="postcode" @change="fetchAddress">
<input name="address">
</template>