通过具名 slot (插槽) 来显示Dialog 的标题

做项目时遇到一个问题:在Dialog中写入副标题,可是 dialog的title是一个字符串啊,怎么在title中写入两个不同样式的字符串呢?
问题:如下图
通过具名 slot (插槽) 来显示Dialog 的标题_第1张图片

这是一个dialog , 通常我们的写法是这样的:




所以这种情况,我们没法去写副标题,还要加一些样式来区别主标题和副标题,即图中的 2 部分,那怎么办呢,还好有slot,所以我们可以这样来解决:


  
      {{title}}
      {{subTitle}}
  
  ....
  
  在data中:
  data () {
	return {
		title: "选择省区",
      	subTitle: "每次只能登录一个省区",
	}
}

这样我们就可以很灵活的定义主标题和副标题的样式了,这样问题就得到解决了。完美!

你可能感兴趣的:(WEB前端开发,Vue学习总结)