源文件

jeepay-ui-manager/src/components/JeepayUIComponents/JeepayAreaSelect/JeepayBankAreaSelectLkl.vue

@@ -0,0 +1,30 @@
+<!--
+  省市县三级联动选择 （拉卡拉）
+
+  @author xiaoyu
+  @site https://www.jeequan.com
+  @date 2022/01/17 19:34
+-->
+
+<template>
+  <a-cascader :value="props.value" :options="allList" placeholder="选择省市县" @change="changeFunc" :getPopupContainer="(triggerNode) => (triggerNode.parentElement)" />
+</template>
+<script lang="ts" setup>
+import { defineProps } from 'vue'
+import allList from './bankAreacodeLkl.json'
+
+const props = defineProps({
+    value: { type: Array, default: null },
+})
+
+// emit 父组件使用： v-model="val" 进行双向绑定。
+const emit = defineEmits(['update:value', 'change'])
+
+// 当属性发生了变化， 需要通过函数向父组件通信 --》 父组件再通知子组件进行数据的变化。 
+function changeFunc(value, selectedOptions){
+    emit('change', selectedOptions)
+    emit('update:value', value)
+}
+
+</script>
+