hookehuyr

feat(AddressSelector): 添加nut-config-provider包装级联选择器以支持主题变量

为AddressSelector组件中的nut-cascader添加nut-config-provider包装,支持通过themeVars配置主题样式,如激活项颜色
...@@ -56,6 +56,7 @@ ...@@ -56,6 +56,7 @@
56 </nut-popup> 56 </nut-popup>
57 57
58 <!-- 省市县级联选择器 - 放在popup外面避免层级冲突 --> 58 <!-- 省市县级联选择器 - 放在popup外面避免层级冲突 -->
59 + <nut-config-provider :theme-vars="themeVars">
59 <nut-cascader 60 <nut-cascader
60 v-model="selectedAreaCodes" 61 v-model="selectedAreaCodes"
61 v-model:visible="showAreaPicker" 62 v-model:visible="showAreaPicker"
...@@ -64,6 +65,7 @@ ...@@ -64,6 +65,7 @@
64 @path-change="onAreaPathChange" 65 @path-change="onAreaPathChange"
65 title="请选择省市县" 66 title="请选择省市县"
66 /> 67 />
68 + </nut-config-provider>
67 </view> 69 </view>
68 </template> 70 </template>
69 71
...@@ -72,6 +74,12 @@ import { ref, computed, watch } from 'vue' ...@@ -72,6 +74,12 @@ import { ref, computed, watch } from 'vue'
72 import { RectRight, ArrowRight } from '@nutui/icons-vue-taro' 74 import { RectRight, ArrowRight } from '@nutui/icons-vue-taro'
73 import { areaList } from '@vant/area-data' 75 import { areaList } from '@vant/area-data'
74 76
77 +const themeVars = {
78 + // cascaderBarColor: 'orange',
79 + // cascaderItemColor: 'orange',
80 + cascaderItemActiveColor: 'orange',
81 +}
82 +
75 /** 83 /**
76 * 转换@vant/area-data的扁平化数据为NutUI Cascader组件需要的树形结构 84 * 转换@vant/area-data的扁平化数据为NutUI Cascader组件需要的树形结构
77 * @param {Object} areaList - @vant/area-data的原始数据 85 * @param {Object} areaList - @vant/area-data的原始数据
......