Antdesign vue Modal 框样式修改

在普通组件中可以使用vue2 /deep/ .选择器名称修改样式 或者vue3 :deep(.选择器名称)

    :deep(.ant-input::placeholder){
        font-size: 13px;
    }
    /deep/.ant-btn-lg{
         height: 28px;
         padding: 0;
       background-color:transparent;
    }

但Modal框样式需要使用getContainer这个api来进行节点挂载，才能使用上述两种方法去修改样式

<div ref='mod'>
    <Modal v-model:visible="visible"  @ok="handleOk" :getContainer = '()=>$refs.mod' :width="width" >
        <template #footer>
            <a-button key="back" @click="handleCancel">重置</a-button>
            <a-button key="submit" type="primary" :loading="loading" @click="handleOk">确定</a-button>
        </template>
        <div class="content">
            <p>热门城市</p>
            <div class="spancontainer">
                <span v-for="(item,index ) in firstdata" key="item.index" @click="handleselect(item.id)" :class="item.ischeck?'select':''">{{item.name}}</span>
            </div>
          
        </div>
    </Modal>
</div>

在外层div 使用ref='mod'绑定，在Modal 使用 :getContainer = '()=>$refs.mod'进行挂载后 可以使用/deep/修改，当然 Modal也有api修改样式，如width等