问题描述

在开发过程中使用IView组件库中的Modal组件,想要修改Modal的宽度,但是直接修改Modal组件自带的类名不生效。

解决办法(以修改Modal组件宽度为例)

官方文档提供了如何修改Modal自定义样式的方法:IView-Modal对话框

在Modal组件中使用class-name来给对话框容器添加类名,添加的类名加到了.ivu-modal-wrap这一容器上,可以辅助实现我们想要的自定义效果。

		   <template>
		  	   <Modal
			        class-name="modify-style"
			        title="修改IView默认样式">
			   </modal>
			   <Modal
			   		title="修改IView默认样式"
		            :styles="{width: '800px'}">
		        </Modal>
		   <template>
		   <style>
		   		.modify-style .ivu-modal {
		   			width:800px !important;
		   		}
		   	</style>

如果对你有所帮助,请记得一键三联哦

GitHub 加速计划 / vu / vue
109
18
下载
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
最近提交(Master分支:4 个月前 )
9e887079 [skip ci] 1 年前
73486cb5 * chore: fix link broken Signed-off-by: snoppy <michaleli@foxmail.com> * Update packages/template-compiler/README.md [skip ci] --------- Signed-off-by: snoppy <michaleli@foxmail.com> Co-authored-by: Eduardo San Martin Morote <posva@users.noreply.github.com> 1 年前
Logo

AtomGit 是由开放原子开源基金会联合 CSDN 等生态伙伴共同推出的新一代开源与人工智能协作平台。平台坚持“开放、中立、公益”的理念,把代码托管、模型共享、数据集托管、智能体开发体验和算力服务整合在一起,为开发者提供从开发、训练到部署的一站式体验。

更多推荐