源文件

jeepay-ui-manager/src/components/JeepayUIComponents/JeepayMccSelect/JeepayHmpayMccSelect.vue

@@ -0,0 +1,37 @@
+<template>
+  <a-cascader :value="selectValue" :options="allList" placeholder="选择经营类目编码" @change="changeFunc" />
+  <!-- <span style="color: red;">{{ vdata.msg }}</span> -->
+</template>
+<script lang="ts" setup>
+import { defineProps, defineEmits, computed, reactive } from 'vue'
+import allList from './mccHmpay.json'
+
+const vdata = reactive({
+  msg: ''
+})
+
+// 定义组件的传入参数 
+const props = defineProps({
+    value: { type: String, default: '' }
+})
+
+// emit： 向父组件进行通讯。 
+const emit = defineEmits(['update:value'])
+
+// 计算属性 
+const selectValue = computed(() => {
+   if (props.value){
+    return props.value.split('_')
+  }
+  return null
+})
+
+// 当属性发生了变化， 需要通过函数向父组件通信 --》 父组件再通知子组件进行数据的变化。 
+function changeFunc(value, selectedOptions){
+  console.log(value)
+    emit('update:value', value[0] + '_' + value[1])
+    vdata.msg = selectedOptions[1].msg?selectedOptions[1].msg:''
+}
+
+</script>
+