ANT DESIGN VUE model 对话框标题改造

最新推荐文章于 2024-09-11 21:26:01 发布

渣渣灰飞

最新推荐文章于 2024-09-11 21:26:01 发布

阅读量5k

点赞数 6

文章标签： Ant Design Vue 对话框插槽提示信息自定义头部

本文链接：https://blog.csdn.net/flhhly/article/details/122985628

版权

一、需求：

给对话框标题处，加除标题之外的提示信息

二、开始改造：

1、改造好的示例

2、官方文档提示：

详细地址：Ant Design Vue

3、代码：

  <a-modal
      v-model="visible"
      :maskClosable="false"
      
      width="900px"
     
    >
    //通过插槽设置标题
      <template slot="title">
        <a-space
          ><span>配置资源</span
          ><span style="fontSize:12px;color:#B3B3B3"
            >(注意：该组件最少添加三个，最多选择五个)</span
          ></a-space
        >
      </template>
     
    </a-modal>

只需要去掉a-model标签中绑定的title，在其内部使用插槽，便可对对话框头部进行各种自定义设置