38 lines
1014 B
Vue
38 lines
1014 B
Vue
<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>
|
||
|