ant design vue2 级联选择器placeholder颜色修改
时间: 2023-08-03 08:06:07 浏览: 143
修改输入框placeholder文字默认颜色-webkit-input-placeholder方法
可以通过以下两种方式修改Ant Design Vue 2级联选择器的placeholder颜色:
1. 使用CSS样式进行修改:
```css
/* 修改级联选择器的placeholder颜色 */
/* 一级菜单placeholder颜色 */
.ant-cascader-picker-placeholder,
/* 二级及以下菜单placeholder颜色 */
.ant-cascader-menu-item-empty.ant-cascader-menu-item-expand:before {
color: #999;
}
```
2. 在级联选择器组件中设置`placeholder`属性时加上`style`属性进行修改:
```html
<template>
<a-cascader :options="options" :placeholder="placeholder" :style="{ color: '#999' }"></a-cascader>
</template>
<script>
export default {
data() {
return {
options: [
{
value: 'zhejiang',
label: 'Zhejiang',
children: [
{
value: 'hangzhou',
label: 'Hangzhou',
children: [
{
value: 'xihu',
label: 'West Lake',
},
],
},
],
},
{
value: 'jiangsu',
label: 'Jiangsu',
children: [
{
value: 'nanjing',
label: 'Nanjing',
children: [
{
value: 'zhonghuamen',
label: 'Zhong Hua Men',
},
],
},
],
},
],
placeholder: '请选择地址',
};
},
};
</script>
```
阅读全文